Skip to content
This repository has been archived by the owner on Jul 12, 2023. It is now read-only.

Accessibility improvements #549

Merged
merged 2 commits into from
Jan 18, 2022
Merged

Accessibility improvements #549

merged 2 commits into from
Jan 18, 2022

Conversation

oliverlloyd
Copy link
Contributor

What does this change?

This PR adds 2 accessibility improvements

  1. An aria label for the Recommend button
  2. It removes FocusLock, improving keyboard access to the filters

Why?

We don't need to lock focus on these filters because it's logical to tab through them and the previous package we were using was causing focus to stop on two hidden divs, which would be confusing for people who use screen readers

Focus before

It's hard to see from the recording but focus is landing on two hidden divs when tabbing through the menus

Screen.Recording.2022-01-18.at.16.12.49.mov

Focus after

without.mov

Wait, look, it's James!

@jamesgorrie - you left but we never stopped staring at your sunflower avatar

@github-actions
Copy link
Contributor

Size Change: -268 B (0%)

Total Size: 218 kB

Filename Size Change
build/App.esm.js 109 kB -120 B (0%)
build/App.js 109 kB -148 B (0%)

compressed-size-action

Copy link
Contributor

@OllysCoding OllysCoding left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM! Nice shoutout to @jamesgorrie as well!

@oliverlloyd oliverlloyd merged commit 1011f29 into main Jan 18, 2022
@oliverlloyd oliverlloyd deleted the oliver/accessibility-lock branch January 18, 2022 16:40
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants