Osano Cookie Banner low-contrast issue on mobile

thetwopct commented 1 year ago

Lighthouse is flagging a link and text in the cookie banner as having poor contrast on mobile devices. WebAims checker says the combination passes (as does AXE).

Should we ignore this warning from Google?

This version of the report shows a screenshot:

Screenshot-2023-06-30 --22 07 58

If we wanted to try and solve:

Up its size to 18px (from 16px)
Make the link black/another color instead of pink
make the body font slightly bigger (14px instead of 13px) and removing the condensed letter spacing (f the body text continues to be flagged, or if the link being in that text is causing it to be flagged)

cjyabraham commented 1 year ago

It seems like Lighthouse is right in this case and the others missed it. Like you suggest, maybe we just keep font sizes the same as on desktop, which passes?

cjyabraham commented 12 months ago

I don't understand why the body text is flagged. Black on blue should have a contrast ratio of 17. The pink on blue does need fixing. I can up the size of the text to 19px which is the minimum I think.

cjyabraham commented 12 months ago

This is deployed and appears to have moved our Accessibility score back to 100.

cncf / cncf.io

Osano Cookie Banner low-contrast issue on mobile #753