search

GCTC-NTGC / gc-digital-talent

GC Digital Talent is the new recruitment platform for digital and tech jobs in the Government of Canada. // Talents numériques du GC est la nouvelle plateforme de recrutement pour les emplois numériques et technologiques au gouvernement du Canada.
https://talent.canada.ca
GNU Affero General Public License v3.0
21 stars 8 forks source link

🐛 Theme switcher has no visible hover state when tabbing #11571

Open petertgiles opened 4 days ago

petertgiles commented 4 days ago

🐛 Bug

If you're tabbing through the page is no visible hover state to know where the focus is when it is on the theme switcher. It seems like there is one tab stop for the entire switcher component, not three different stops. Once the theme switcher is selected there are visible hover states for the three buttons.

With the mouse, there is a visible hover state for three buttons but not the entire switcher component.

🦋 Expected Behaviour

🕵️ Details

📋 Steps to Reproduce

📸 Screenshot

Tab order: image

Demo video: https://github.com/user-attachments/assets/c4097edd-7f0e-46bd-88ad-63e3e568ece9

🙋‍♀️ Proposed Solution

Perhaps the same blue border could be used for tabbing onto the theme switcher is as already exists for clickable images like the government logo in the header.

✅ Acceptance Criteria

petertgiles commented 8 hours ago

@JoshBeveridge Do you have a design suggestions for this one?