Skip to content
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

Improve support for Internet Explorer 11 with Windows High Contrast Mode #2290

Merged
merged 1 commit into from
Aug 20, 2021

Conversation

lfdebrux
Copy link
Member

@lfdebrux lfdebrux commented Jul 30, 2021

This PR adds support for IE11 to the previous Windows High Contrast Mode fixes in PR #2264.

Internet Explorer 11 doesn't support the forced-colors media feature or the forced-color-adjust property, but it has equivalents in -ms-high-contrast and -ms-high-contrast-adjust. We can use those CSS features to extend fixes to high contrast mode that previously only worked on more modern browsers.

Fix Before After
Form control focus states Screenshot of focus controls in Internet Explorer 11 before change Screenshot of focus controls in Internet Explorer 11 before change

There are a couple of other places in our codebase where we have fixes for forced color mode (see PRs #2186, #2237), but the problems they fix don't seem to be present in IE11 (I think because it doesn't have a readability backplate), so I left those lines alone.

@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-pr-2290 July 30, 2021 08:25 Inactive
@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-pr-2290 August 19, 2021 08:44 Inactive
@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-pr-2290 August 19, 2021 08:45 Inactive
@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-pr-2290 August 19, 2021 08:58 Inactive
@36degrees 36degrees added this to the v3.13.1 milestone Aug 19, 2021
@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-pr-2290 August 19, 2021 09:52 Inactive
@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-pr-2290 August 19, 2021 09:53 Inactive
@lfdebrux lfdebrux marked this pull request as ready for review August 19, 2021 09:53
Adds IE11 support to the previous Windows High Contrast Mode fixes in PR

Internet Explorer 11 doesn't support the `forced-colors` media feature
or the `forced-color-adjust` property, but it has equivalents in
`-ms-high-contrast` and `-ms-high-contrast-adjust`.
We can use those CSS features to extend fixes to high contrast mode that
previously only worked on more modern browsers.

Adds a tweak to changes in commit 7dcba7d, so that the highlight works
in Internet Explorer 11 as well.
@lfdebrux
Copy link
Member Author

Just added a changelog line to this commit!

@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-pr-2290 August 20, 2021 15:30 Inactive
@lfdebrux lfdebrux merged commit 4b42bc2 into main Aug 20, 2021
@lfdebrux lfdebrux deleted the ldeb-improve-ie11-hcm branch August 20, 2021 15:35
@EoinShaughnessy EoinShaughnessy changed the title Improve support for IE11 with Windows High Contrast Mode Improve support for Internet Explorer 11 with Windows High Contrast Mode Aug 31, 2021
@vanitabarrett vanitabarrett mentioned this pull request Sep 7, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
Development

Successfully merging this pull request may close these issues.

4 participants