-
Notifications
You must be signed in to change notification settings - Fork 90
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
Windows10 select box contrast ratio in IE and Edge #456
Conversation
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.
Looks fine to me, I haven't tested as the screenshots look conclusive.
Only nit I have, if you can interactive rebase the commits into one with a short title and a descriptive body about this fix. Our git styleguide can provide examples. (or look at some of the other commits)
// 7. Browser accessibility fixes | ||
// ========================================================================== | ||
|
||
option:active, |
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.
Are you sure :active
is needed? My gut feeling said :checked
is weird but from testing all 3 of them just now, it seems like :checked
is needed for the activate state when the select box is open and :focus::-ms-value
is needed for the active state when the select box is closed (but still focussed). Do you know for what case :active
is needed?
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.
to retain the correct background colour as you press down with a mouse
see http://codepen.io/igloo/pen/EmNdmp
I also just tested if the adding the colours does anything when changing colours via browser or system settings. (We found earlier that that can sometimes be challenging.) But that all looks good. I also just noticed that the colour combination of white and our govuk-blue fails WCAG AAA (both variations of foreground and background). But I assume that must be a known issue and that we intentionally didn't fix it (for our links). (I think I vaguely remember something about it being difficult to find a blue that is not too dark so that it's difficult to distinguish from normal text around it.) |
|
edd918f
to
d997796
Compare
d997796
to
04a77ca
Compare
04a77ca
to
a6934f5
Compare
a6934f5
to
e2714f3
Compare
e2714f3
to
5233dff
Compare
5233dff
to
acf59c7
Compare
In Windows 10 on Internet Explorer and Edge selected and active options in select boxes have a light blue visual treatment. That differes from other browser vendors' implementation and it it has a contrast ration 2.9:1 which is not accesible. By applying microsoft only CSS values using the GOV.UK blue this has now been fixed.
acf59c7
to
485d49e
Compare
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.
The commit history is much better now. Thanks @igloosi. Feel free to fix typos in the commit message or not.
What problem does the pull request solve?
Accessibility fix on Windows 10 IE and Edge select box active
Issue : https://trello.com/c/LGKKreic/461-tech-spike-insufficient-colour-contrast-of-select-box-items
How has this been tested?
Tested on IE11 and Edge 15 where the issue existed.
Also tested on latest Chrome. Firefox and Safari to make sure nothing was affected there.
Before:
After:
What type of change is it?