You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository was archived by the owner on Sep 2, 2024. It is now read-only.
[Edit: In the demo] users of Windows High Contrast who rely on keyboard cannot see what is being focused, neither the button which opens the datepicker, nor anything inside once it is opened.
To Reproduce
Steps to reproduce the behavior:
Open demo datepicker in a Windows browser which supports WHC (Firefox, Edge. IE if you're brave)
Press Alt+Shift+PrtScn to activate Windows High Contrast. It shouldn't matter which theme is running
Attempt to use the datepicker with keyboard. Focus is visible when the input receives focus, but not the calendar-activation button nor anything inside.
Expected behavior
A focus ring is always available.
Additional context
I will attempt a PR this weekend, although I didn't find the focus styles when looking through the code via Github. [Edit: only the demo has styles]
The solution is simple though: change the outline: 0 on the focus states to outline: 3px dotted transparent. This gives WHC users a visible outline while no other users will see an outline.
Edit: Ideally the demo shows this so developers see examples of code for all users :D
[Edit: In the demo] users of Windows High Contrast who rely on keyboard cannot see what is being focused, neither the button which opens the datepicker, nor anything inside once it is opened.
To Reproduce
Steps to reproduce the behavior:
Expected behavior
A focus ring is always available.
Additional context
I will attempt a PR this weekend, although I didn't find the focus styles when looking through the code via Github. [Edit: only the demo has styles]
The solution is simple though: change the outline: 0 on the focus states to outline: 3px dotted transparent. This gives WHC users a visible outline while no other users will see an outline.
Edit: Ideally the demo shows this so developers see examples of code for all users :D