Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix comment section style inconsistency and more... #3231

Merged
merged 3 commits into from
May 22, 2023

Conversation

PikachuEXE
Copy link
Collaborator

@PikachuEXE PikachuEXE commented Feb 28, 2023

Fix comment section style inconsistency

Pull Request Type

  • Bugfix
  • Feature Implementation
  • Documentation
  • Other

Related issue

N/A

Description

After all comments loaded there is no spacing at the bottom
It's very obvious when there are only a few comments

Screenshots

Before

image
image
image
image

After

image
image
image
image

Testing

A. Video with comments

B. Video without comment

  • View a video without comment (e.g. https://youtu.be/CIhSi6gwT9E)
  • Inspect comment section style before comments loaded
  • Inspect comment section style after comments loaded
  • Inspect visibility of components inside comments section (i.e. only "no comments" message should be visible)

C1. Video with comment disabled (Local API)

  • View a with comment disabled (e.g. https://youtu.be/8NBSwDEf8a8)
  • Inspect comment section style after comments loaded (already loaded on startup)
  • Inspect visibility of components inside comments section (i.e. only "no comments" message should be visible)

C2. Video with comment disabled (Invidious API)

  • View a with comment disabled (e.g. https://youtu.be/8NBSwDEf8a8)
  • Inspect comment section style before comments loaded
  • Inspect comment section style after comments loaded
  • Inspect visibility of components inside comments section (i.e. only "no comments" message should be visible)

Desktop

  • OS: MacOS
  • OS Version: 12.6.2
  • FreeTube version: 3c3325d

Additional context

Side effect:

  • Comment section becomes "fatter" before comments loaded

Use my custom build if you don't want to build

@FreeTubeBot FreeTubeBot enabled auto-merge (squash) February 28, 2023 01:39
@github-actions github-actions bot added the PR: waiting for review For PRs that are complete, tested, and ready for review label Feb 28, 2023
@PikachuEXE
Copy link
Collaborator Author

@absidue :)

@PikachuEXE
Copy link
Collaborator Author

I found that the comment sort select component can't be clicked sometimes (not sure if caused by this change)
Anyway fixed it now

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lgtm

@absidue
Copy link
Member

absidue commented Mar 12, 2023

I'm pretty sure the sort component issue is because it's positioned with float, which is kind of evil and ignores the layout of most other elements but that was already like it before this pull request.

@PikachuEXE
Copy link
Collaborator Author

I think that can be fixed in another PR
This comment style issue is more "visible" to users

CSS is always a challenge
Please also enjoy this random meme - Backend developer with CSS...

@PikachuEXE
Copy link
Collaborator Author

PikachuEXE commented Mar 13, 2023

(See update 2)

I played around with flex but it might look like this
I think it's a bit complicated to "fix" that issue and should not belong to this PR
image

Update 1: or like this
image
image

Update 2: or like this
image
image

@PikachuEXE
Copy link
Collaborator Author

Request for comment about the additional style fix (see the comment above, mostly update 2)

@PikachuEXE
Copy link
Collaborator Author

Just fixed case for video with comment disabled

@efb4f5ff-1298-471a-8973-3d47447115dc

Umm are there any additional testcases i should know about? Except for the ones in the pr body.

@github-actions github-actions bot added PR: merge conflicts / rebase needed and removed PR: waiting for review For PRs that are complete, tested, and ready for review labels Apr 27, 2023
@github-actions
Copy link
Contributor

This pull request has conflicts, please resolve those before we can evaluate the pull request.

@github-actions
Copy link
Contributor

Conflicts have been resolved. A maintainer will review the pull request shortly.

@efb4f5ff-1298-471a-8973-3d47447115dc

@ChunkyProgrammer chunky powers needed

@FreeTubeBot FreeTubeBot merged commit 9523bc7 into FreeTubeApp:development May 22, 2023
@github-actions github-actions bot removed the PR: waiting for review For PRs that are complete, tested, and ready for review label May 22, 2023
@PikachuEXE PikachuEXE deleted the fix/comment-style branch May 30, 2023 01:53
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants