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.

Sign up for GitHub

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

Jump to bottom

[Bug]: catppuccinMocha: Color contrast for owner comments is too low #6597

Open
5 of 6 tasks
artkapl opened this issue Jan 16, 2025 · 4 comments · May be fixed by #6896
Open
5 of 6 tasks

[Bug]: catppuccinMocha: Color contrast for owner comments is too low #6597

artkapl opened this issue Jan 16, 2025 · 4 comments · May be fixed by #6896
Labels
B: accessibility bug Something isn't working good first issue Good for newcomers U: reproduced

Comments

@artkapl
Copy link

artkapl commented Jan 16, 2025 •
edited
Loading

Guidelines

  • I have encountered this bug in the latest release of FreeTube.
  • I have encountered this bug in the official downloads of FreeTube.
  • I have searched the issue tracker for open and closed issues that are similar to the bug report I want to file, without success.
  • I have searched the documentation for information that matches the description of the bug I want to file, without success.
  • This issue contains only one bug.

Describe the bug

  1. Go to settings and set base theme to Catppuccin Mocha
  2. Go to any video with comments from the uploader, e.g. https://youtu.be/IKbFBgNuEOU
  3. Observe the color highlight around the uploader's username (see Feature: Add pinned, owner and reply from owner indicators for comments #1795)
  4. Switch to any other theme (e.g. Light or Dark)
  5. Note the much more pronounced color contrast for the username highlight.

Expected Behavior

A clear label for an uploader's comment, no matter the theme used. This is important for accessibility.

Issue Labels

accessibility issue

FreeTube Version

v0.22.1

Operating System Version

Windows 10 22H2

Installation Method

.exe

Primary API used

Local API

Last Known Working FreeTube Version (If Any)

No response

Additional Information

See https://webaim.org/resources/contrastchecker/?fcolor=1E1E2E&bcolor=181825, a contrast ratio of 1.07:1 is much too low. A rule of thumb is at least 4.5:1 for proper legilibility.

The relevant CSS properties are card-bg-color and secondary-card-bg-color for .catppuccinMocha

Screenshots:

Catppuccin Mocha:
Image

Dark theme:
Image

Nightly Build
@artkapl artkapl added the bug Something isn't working label Jan 16, 2025
@github-project-automation github-project-automation bot moved this to To assign in Bug Reports Jan 16, 2025
@kommunarr kommunarr added the good first issue Good for newcomers label Jan 16, 2025
nanikh91 pushed a commit to nanikh91/FreeTube that referenced this issue Jan 19, 2025
Fix: increased color contrast for uploader comments in Catppuccin Moc…
19eeb46 
…ha theme FreeTubeApp#6597
@nanikh91 nanikh91 mentioned this issue Jan 19, 2025
Closed
4 tasks
@nanikh91
Copy link

Hi everyone,

I’ve worked on the color contrast issue for the uploader’s comments in the Catppuccin Mocha theme (#6597). I’ve made adjustments to the CSS to ensure the contrast ratio is improved for better readability and accessibility. Specifically, I modified the colors related to the uploader's username highlight, making it more distinguishable against the background.

I’ve tested the changes locally on macOS 11 and can confirm that the contrast is now more pronounced, meeting the accessibility standards. You can find the relevant pull request here: #6603.

Looking forward to your feedback, and let me know if further adjustments are needed.

Thank you!

@artkapl
Copy link
Author

artkapl commented Jan 19, 2025

Love it, thank you! :)

@kommunarr kommunarr mentioned this issue Jan 24, 2025
Merged
4 tasks
@artkapl
Copy link
Author

artkapl commented Feb 22, 2025

While I am grateful to @nanikh91, since the PR is stale, I'd like to work on it myself and try to fix the contrast (assuming no new commits or other PRs wish to address this issue).

@efb4f5ff-1298-471a-8973-3d47447115dc
Copy link
Member

go for it!

@artkapl artkapl linked a pull request Feb 23, 2025 that will close this issue
Open
4 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
B: accessibility bug Something isn't working good first issue Good for newcomers U: reproduced
Projects
Bug Reports
Status: To assign
Milestone
No milestone
4 participants
@artkapl @efb4f5ff-1298-471a-8973-3d47447115dc @kommunarr @nanikh91