1697150 - User-picked accent color no longer applies (e.g. to focus styles)

Status: NEW

(Firefox :: Theme, defect, P3)

Description

[Martin Balfanz [:mbalfanz]]

Attachment: difference.png

With proton enabled, the focus styles of the browser UI as well as in-page content does no longer respect the user selected accent color. I'm seeing this on Mac.

STR:

• Select an accent color other than blue, for example pink
• focus the awesome bar, or the "find in page" input field, or a random button (e.g. on https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_button_test)
• observe the focus ring

AR:

• Focus ring shows up in a variant of blue color (light blue when using dark mode, dark blue when using light mode, double-blue for in-page content)

ER:

• Focus ring should use my accent color.

Note

• There seem to be also differences between OS 10.15 and OS 11.

Comment 1

[Martin Balfanz [:mbalfanz]]

Attachment: Screenshot 2021-03-09 at 14.19.42.png

This issue seems to apply to more places, not just focus styles. See in this screenshot the first highlighted search result, which should be highlighted in pink (accent color) and not blue.

Comment 2

[Martin Balfanz [:mbalfanz]]

(updating title and removing the text I accidently had in the comment field)

Comment 3

[Harry Twyford]

Not using system highlight colours for focus borders and result selection were specific requests from UX for Proton. That said, I think we should leave this bug open in case they reconsider in the future.

Comment 4

[Markus Stange [:mstange]]

I think there are two sub-bugs here:

• Focus rings everywhere should be using -moz-mac-focusring on macOS. Before Proton, we were using Highlight in some places (e.g. the URL bar), which is too dark; and with Proton, we're using a hard-coded blue, which is both too dark and doesn't respect the accent color.
• Selected rows in the URL bar dropdown should be using Highlight.