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

Dark mode anchor contrast to low #15802

Closed
alehaa opened this issue Apr 22, 2024 · 1 comment
Closed

Dark mode anchor contrast to low #15802

alehaa opened this issue Apr 22, 2024 · 1 comment
Assignees
@arthanson
Labels
beta Concerns a bug/feature in a beta release severity: low Does not significantly disrupt application functionality, or a workaround is available status: accepted This issue has been accepted for implementation topic: UI/UX User interface or user experience related work type: bug A confirmed report of unexpected behavior in the application

Comments

@alehaa
Copy link
Contributor

alehaa commented Apr 22, 2024

Deployment Type

Self-hosted

NetBox Version

v4.0-beta1

Python Version

3.11

Steps to Reproduce

  1. Activate dark mode
  2. Navigate to Site list
  3. Inspect first columns site name with the browser debug toolbar
  4. Check text color and background color attributes
  5. Calculate contrast ratio.

Expected Behavior

According to WCAG 2.1 accessibility standard, a bare minimum contrast ratio of 3:1 is required, 4.5:1 would be better.

Observed Behavior

A ratio of 2.92:1 was calculated.

Responsible for the link color is the CSS variable --tblr-link-color-rgb. I found that the Tabler Demo uses slightly different colors. However, I can't find the cause why, as netbox.scss doesn't seem to change related Tabler variables.
@alehaa alehaa added status: needs triage This issue is awaiting triage by a maintainer type: bug A confirmed report of unexpected behavior in the application labels Apr 22, 2024
@jeremystretch jeremystretch added the beta Concerns a bug/feature in a beta release label Apr 22, 2024
@jeffgdotorg jeffgdotorg removed their assignment Apr 23, 2024
@jeffgdotorg jeffgdotorg added topic: UI/UX User interface or user experience related work and removed status: needs triage This issue is awaiting triage by a maintainer labels Apr 23, 2024
@jeffgdotorg
Copy link
Contributor

Thanks for your report. We're aware that 4.0-beta1 has many low visual contrast problems and we hope to address them before the final.

@arthanson arthanson self-assigned this Apr 24, 2024
@arthanson arthanson mentioned this issue Apr 24, 2024
Merged
@jeremystretch jeremystretch added status: accepted This issue has been accepted for implementation severity: low Does not significantly disrupt application functionality, or a workaround is available labels Apr 29, 2024
jeremystretch added a commit that referenced this issue May 3, 2024
@jeremystretch
Changelog for #15630, #15802, #15831, #15852, #15915, #15942, #15944
b91741d
@jeremystretch jeremystretch mentioned this issue May 6, 2024
Merged
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Aug 1, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@arthanson arthanson

Labels
beta Concerns a bug/feature in a beta release severity: low Does not significantly disrupt application functionality, or a workaround is available status: accepted This issue has been accepted for implementation topic: UI/UX User interface or user experience related work type: bug A confirmed report of unexpected behavior in the application
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@arthanson @jeffgdotorg @alehaa @jeremystretch