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: Low Contrast on Arrows in "Go Back" and "Up Next" Buttons in Dark mode and responsiveness issue #1292

Open
Karan-Palan opened this issue Jan 11, 2025 · 5 comments · May be fixed by #1336
Open

🐛 Bug: Low Contrast on Arrows in "Go Back" and "Up Next" Buttons in Dark mode and responsiveness issue #1292

Karan-Palan opened this issue Jan 11, 2025 · 5 comments · May be fixed by #1336
Assignees
@sahitya-chandra
Labels
🐛 Bug Indicates that the issue is a bug or defect. Status: Available No one has claimed responsibility for resolving this issue. Status: In Progress This issue is being worked on, and has someone assigned.

Comments

@Karan-Palan
Copy link
Contributor

Describe the bug

  1. The arrows in the "Go Back" and "Up Next" buttons have insufficient contrast in the Dark mode, making them difficult to read against the button background. This affects usability and does not meet WCAG guidelines for accessibility.
  2. Inconsistent vertical stacking and alignment of text and arrows in 'Go Back' and 'Up Next' buttons across all screen sizes.

Steps To Reproduce

  1. Navigate to any page with "Go Back" and "Up Next" buttons
  2. Observe the color contrast of the arrows in the navigation buttons.
  3. Compare the arrow color with the background to verify readability issues.
  4. Halve the tab, check the text alignment in arrow buttons

Expected Behavior

  1. The arrow color should contrast clearly with the button background to ensure readability. It should meet WCAG contrast standards and be visible under normal viewing conditions.
  2. Ensure consistent vertical stacking and alignment of text and arrows in 'Go Back' and 'Up Next' buttons across all screen sizes.

Screenshots

  1. The color of the arrows
    image

  2. Responsiveness of text when the tab is full vs when the tab is halved
    Full tab:
    image
    Half tab:
    image

Device Information [optional]

- OS:Ubuntu 24
- Browser:Firefox
- version:LTS

Are you working on this issue?

Yes

Do you think this work might require an [Architectural Decision Record (ADR)]? (significant or noteworthy)

No
@Karan-Palan Karan-Palan added Status: Triage This is the initial status for an issue that requires triage. 🐛 Bug Indicates that the issue is a bug or defect. labels Jan 11, 2025
@palakm-26
Copy link

hey @Karan-Palan ,i wound like to contribute on this issue.

@Karan-Palan
Copy link
Contributor Author

Hello @palakm-26, I'm just a contributor here. Seems you are new, please check Contributing and Triage process.
I have mentioned in the issue that I'd work on it and have made the relevant changes locally, however I wouldn't mind you taking this up, and since this is a small change,it'd would help you get started. Wait for the maintainers to accept the issue if valid, and they'll assign you this after reading this comment

@DhairyaMajmudar DhairyaMajmudar added Status: Accepted It's clear what the subject of the issue is about, and what the resolution should be. Status: Available No one has claimed responsibility for resolving this issue. and removed Status: Triage This is the initial status for an issue that requires triage. labels Jan 19, 2025
@sahitya-chandra
Copy link

@Karan-Palan can I take this issue ??

@Karan-Palan
Copy link
Contributor Author

I'm just a contributor here @DhairyaMajmudar can assign you this issue as I'm working on other ones rn

@sahitya-chandra
Copy link

@DhairyaMajmudar Sir Please assign this issue to me...

@DhairyaMajmudar DhairyaMajmudar added Status: In Progress This issue is being worked on, and has someone assigned. and removed Status: Accepted It's clear what the subject of the issue is about, and what the resolution should be. labels Jan 19, 2025
@sahitya-chandra sahitya-chandra linked a pull request Jan 20, 2025 that will close this issue
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@sahitya-chandra sahitya-chandra

Labels
🐛 Bug Indicates that the issue is a bug or defect. Status: Available No one has claimed responsibility for resolving this issue. Status: In Progress This issue is being worked on, and has someone assigned.
Projects
None yet
Milestone
No milestone
4 participants
@DhairyaMajmudar @Karan-Palan @sahitya-chandra @palakm-26