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

enhance(a11y-nav): fix background and padding #12121

Merged
merged 1 commit into from
Nov 22, 2024
Merged

enhance(a11y-nav): fix background and padding #12121

merged 1 commit into from
Nov 22, 2024

Conversation

pepelsbey
Copy link
Member

Summary

  • Adds support for dark scheme
  • Improves paddings

Problem

  • Jump anchors (a11y nav) don’t support a dark scheme
  • Link contrast is very low, especially with added transparency
  • Padding is inconsistent with underlying UI elements

Solution

  • Use a variable for the background color
  • Use opaque color for better contrast
  • Adjust paddings

Screenshots

Before

Desktop

before-desktop-light
before-desktop-dark

Mobile

before-mobile-light
before-mobile-dark

After

Desktop

after-desktop-light
after-desktop-dark

Mobile

after-mobile-light
after-mobile-dark

@pepelsbey pepelsbey requested a review from a team as a code owner November 12, 2024 18:42
@caugner caugner changed the title Fix background and padding for jump anchors enhance(a11y-nav): fix background and padding Nov 14, 2024
@fiji-flo fiji-flo merged commit 10a819c into mdn:main Nov 22, 2024
12 checks passed
@github-actions github-actions bot mentioned this pull request Nov 22, 2024
Merged
@pepelsbey pepelsbey deleted the a11y-nav-fix branch November 26, 2024 12:30
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@fiji-flo fiji-flo fiji-flo approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@pepelsbey @fiji-flo