Fix contrast of global search headings

[Pytal]

WCAG AA

“WCAG 2.0 level AA requires a contrast ratio of at least . . . 3:1 for large text.” (Source)

“Large text is defined as 14 point (typically 18.66px) and bold or larger, or 18 point (typically 24px) or larger.” (Source)

Dark mode

Before (18px, normal)	After (19px, bold)

Contrast ratio

Light mode

Before (18px, normal)	After (19px, bold)

Contrast ratio

[Pytal]

/backport to stable25

[PVince81]

👍

[Pytal]

/rebase

[jancborchardt]

Shouldn’t we adjust color-primary-element to be lighter in dark mode? Cause where do we use it anyway, if as text color it doesn’t work?

[Pytal]

Shouldn’t we adjust color-primary-element to be lighter in dark mode? Cause where do we use it anyway, if as text color it doesn’t work?

It's used by primary buttons

With the recent switch from #0082c9 to #00639a if we switch to a lighter color #0088d1 (lighter than #0082c9) to meet contrast requirements for text on dark backgrounds then we would simultaneously no longer meet contrast requirements for the primary button

Any suggestions @jancborchardt?

[Pytal]

Using --color-text-maxcontrast work for you @nimishavijay?

[nimishavijay]

If the field is focused it should be --color-primary-element. If it's not focused then it can be --color-text-maxcontrast :)
Regarding what @jancborchardt was mentioning, I think he meant that since there is a darker variant of the primary color for light mode, there could similarly be a lighter variant for dark mode. So that would be 2 variants of --color-primary-element one for light mode, one for dark mode. Would that make sense?

[Pytal]

If the field is focused it should be --color-primary-element. If it's not focused then it can be --color-text-maxcontrast :) Regarding what @jancborchardt was mentioning, I think he meant that since there is a darker variant of the primary color for light mode, there could similarly be a lighter variant for dark mode. So that would be 2 variants of --color-primary-element one for light mode, one for dark mode. Would that make sense?

With the recent switch from #00639a → #006aa3 we could instead keep the primary color and meet heading contrast requirements by increasing the font size to 19px and bolding

Soung good @nimishavijay?

[nimishavijay]

Alright that sounds good :)

[Pytal]

Alright that sounds good :)

Code + screenshots updated :)

[Pytal]

/backport to stable25

[backportbot-nextcloud]

The backport to stable25 failed. Please do this backport manually.

[backportbot-nextcloud]

The backport to stable25 failed. Please do this backport manually.

#35639