1123793 - support.mozilla.org search field lacks contrast

Status: RESOLVED FIXED

(support.mozilla.org :: Knowledge Base Software, task, P2)

Description

[:Gijs (he/him)]

The contrast ratio for the search field is 3.0:1, and should be 4.5:1 because the font-size is < 16px. Either increase the font size, or (preferred) the contrast by darkening the background color.

Comment 1

[Michael Cooper [:mythmon]]

I used http://contrast-finder.tanaguru.com/ to verify this. It's true, the contrast isn't great. This tool will be quite good for finding better colors to use in the future too.

That tool recommend changing the text color to a dark color (close to black) and keeping the background, or keeping the text color white and darkening or changing the color of the background. Both sound like really easy fixes, since it is just changing a color in CSS. Personally I'd got with a dark text on the same background. Alternatively, we switch to a black on white (or very dark grey on very light grey).

Comment 2

[:Gijs (he/him)]

If we do fix the foreground color CSS, we should remember to fix both the text foreground color and the placeholder foreground color, which look like they're in different places. :-)

Comment 3

[Roland Tanglao needinfo please :rolandtanglao, :mohnkuchen, :adobo, :sinigang, :roland]

let's fix this before the end of 2017, i prefer higher contrast too!

Comment 4

[Joni Chan]

The latest redesign fixed this.

Comment 5

[Firefox Bug Husbandry Bot]

https://bugzilla.mozilla.org/show_bug.cgi?id=1527381