Colour contrast for Primary navigation hover is not AA compliant #447
Labels
Comments
gregtyler
added
bug
|
This is also an issue in Subnavigation |
|
Have been checking whether there's anything in the Design System we could refer to, found this: plans to tackle (pending WCAG 2.2 review), considering adding an accessibility comment on both the primary and subnavigation, (side navgiation not affected) on our side, for accessible use |
gregtyler
added a commit
that referenced
this issue
Dec 15, 2023
…inks Use the standard GDS link hover colour to ensure links colour contrast is sufficient for readability. Fixes #447
gregtyler
added a commit
that referenced
this issue
Dec 15, 2023
…inks Use the standard GDS link hover colour to ensure links colour contrast is sufficient for readability. Fixes #447
gregtyler
added a commit
that referenced
this issue
Dec 15, 2023
Applies to Primary navigation, Sub navigation and Side navigation. Use the standard GDS link hover colour to ensure links colour contrast is sufficient for readability. Ensure borders follow suit, and ensure they're always on the same side of the element. Fixes #447
gregtyler
added a commit
that referenced
this issue
Dec 15, 2023
Applies to Primary navigation, Sub navigation and Side navigation. Use the standard GDS link hover colour to ensure links colour contrast is sufficient for readability. Ensure borders follow suit, and ensure they're always on the same side of the element. Fixes #447
gregtyler
added a commit
that referenced
this issue
Jan 25, 2024
Applies to Primary navigation, Sub navigation and Side navigation. Use the standard GDS link hover colour to ensure links colour contrast is sufficient for readability. Ensure borders follow suit, and ensure they're always on the same side of the element. Fixes #447
gregtyler
added a commit
that referenced
this issue
Jan 25, 2024
Applies to Primary navigation, Sub navigation and Side navigation. Use the standard GDS link hover colour to ensure links colour contrast is sufficient for readability. Ensure borders follow suit, and ensure they're always on the same side of the element. Fixes #447
gregtyler
added a commit
that referenced
this issue
Jan 25, 2024
Applies to Primary navigation, Sub navigation and Side navigation. Use the standard GDS link hover colour to ensure links colour contrast is sufficient for readability. Ensure borders follow suit, and ensure they're always on the same side of the element. Fixes #447
gregtyler
pushed a commit
that referenced
this issue
Jan 25, 2024
# [2.1.0](v2.0.1...v2.1.0) (2024-01-25) ### Features * allow Elements to be used components' config ([372d70b](372d70b)) * **navigation:** enhance hover styles of navigation links ([cd0f9df](cd0f9df)), closes [#447](#447) * **primary-navigation:** auto-hide search toggle when it loses focus ([bedd163](bedd163)), closes [#519](#519)
|
🎉 This issue has been resolved in version 2.1.0 🎉 The release is available on: Your semantic-release bot 📦🚀 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Description
When hovering over a navigation item on the Primary navigation component, the link text is
#5694caon a background of#f3f2f1. At a colour contrast ratio of 2.89:1, this is not AA accessible.Versions
Discovered in v1.6.4, but presumably has been a problem for much longer.
Additional Information
The GOV.UK Design System documentation (which I think the component was originally forked from) is now using a darker colour and additional underline on hover, which fixes the contrast issue and also ensures users who aren't able to detect the contrast difference can still see a hover effect.
The text was updated successfully, but these errors were encountered: