-
-
Notifications
You must be signed in to change notification settings - Fork 178
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.
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
Skin Tone Accessibility Updates #317
base: master
Are you sure you want to change the base?
Skin Tone Accessibility Updates #317
Conversation
Thank you for taking the time to improve the picker @neckenth! I'll take a deeper look in the upcoming days, sorry for the delay. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Hey @neckenth, I left a few comments. Let's sort these out before we can continue.
8673ce9
to
d8ad1d4
Compare
In this PR, I added a few changes to assist with keyboard accessibility and general usage of the Skin Tone Picker.
1 - Unrelated: Adds an aria-label to the Clear Search "x" button
2 - Adds functionality to persist selected skin tone in
localStorage
3 - Allows a user to tab into the Skin Tone Picker
4 - Adds a prop,
fanOutDirection
to the<SkinTonePicker />
component to maintain the default fan-out behavior - which keeps the selected tone in-place and fans all remaining colors to to the left - and adds an option to specify the opposite, where colors will fan out to the right of the selected tone. The goal here was to aid with tab-ability and not interrupt the left --> right tab flow.skin_tone_accessibility.mov