Datepicker Example: Increase colour contrast ratio to pass WCAG (#1170) #1172
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
ZoeBijl
added
the
Example Page
ZoeBijl
changed the title
ZoeBijl
force-pushed
the
1170-datepicker-contrast
branch
from
5e6e52e
to
8b9e6aa
Compare
smhigley
reviewed
Oct 9, 2019
There was a problem hiding this comment.
Color contrast looks great! There are a few Windows high contrast mode bugs, if you're feeling like including those in this PR:
- The calendar icon button's focus isn't visible in HCM, because the border color is the only change (both transparent and colored borders show up the same in HCM)
- The currently selected day isn't visible in HCM
- The focus style for the currently focused day (
.dateButton:focus) is very hard to perceive in HCM
Windows HCM screenshot showing the unfocused icon border, no visible selected date, and focus on the 9th:
Side note -- I'm not sure why, but when you change months with the previous/next month buttons, a day with the same date as the currently selected date has a slight background highlight. If that's intentional it's a contrast issue, but I'm half-guessing it's a separate bug
|
@smhigley I moved the high contrast issues to #1132. More specifically, this comment in that thread. Could you file a separate issue for the date/month switching thing? |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Corrected the colour contrast of various UI elements so that they pass WCAG minimums.
Resolves #1170