footer OGL logo not visible in windows high contrast mode (flagged in an accessibility audit)

[oscarduignan]

Description of the issue

when you are in windows high contrast mode and view the govuk footer in edge, you inherit svg { forced-color-adjust: none; } from the user agent stylesheet which causes the license-logo in the footer to be invisible because the fill and the background are now very close to the same colour.

Steps to reproduce the issue

turn on high contrast on windows and view the footer in edge

Actual vs expected behaviour

that the logo is visible, which could be done with media query targeting forced-colors and setting the color explicitly or by enabling the automatic behaviour of forced-color-adjust for this svg (example below where forced-color-adjust is set to auto - please note when I edited this in edge dev tools I had to close the dev tools and reopen them for some reason for this to apply, just in case you try to recreate the same way)

Environment (where applicable)

• Operating system: Windows 10
• Browser: Microsoft Edge
• Browser version: Version 91.0.864.64 (Official build) (64-bit)
• GOV.UK Frontend Version: latest as far as I can see

[36degrees]

Thanks for reporting this.

This looks like a regression introduced in Chromium 89 when forced colors mode was introduced – it works as expected in Edge 88.

My expectation was that even in forced color mode currentColor should still map to the text colour in which case the OGL logo should be white. It looks like this is an unfortunate side effect of an intentional spec decision (based on Chromium bug #1164162 and w3c/csswg-drafts#4915) but has been flagged as an issue with the CSSWG in w3c/csswg-drafts#6310.

As a result, there's a change to the spec which means hopefully this will be fixed in browsers 'soon'. But that's likely to take a while so in the meantime it seems like setting forced-color-adjust to auto on .govuk-footer__licence-logo as you've suggested does make sense.