1566308 - Findbar text unreadable when using built-in light theme with dark GTK theme

Status: RESOLVED DUPLICATE of bug 1634449

(Toolkit :: Themes, defect, P2)

Description

[RagglenLove]

Attachment: 2019-07-16-094220_1366x768_scrot.png

User Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:68.0) Gecko/20100101 Firefox/68.0

Steps to reproduce:

create a test profile on "about:profiles" and enabled Light Theme on said profile, go to Firefox Home Page, then press Ctrl+F and type "facebook".

Actual results:

"facebook" text on Find bar is not visible.

Expected results:

"facebook" text on Find bar should be black.

Comment 1

[RagglenLove]

I forgot to mention, my operating system is Lubuntu 18.04.

Comment 2

[RagglenLove]

Attachment: 2019-07-16-111224_1366x768_scrot.png

Comment 3

[Kestrel]

Looks like you are using a custom system theme, the default lubuntu 18.04 theme does not have this issue. What theme changes have you made?

Comment 4

[RagglenLove]

I'm using Windows 10 Dark theme: https://github.com/B00merang-Project/Windows-10-Dark/

Comment 5

[RagglenLove]

BTW, I have found another Light Theme that seems to work well with my setup: https://addons.mozilla.org/en-US/firefox/addon/minimal-light-theme-webext/
This theme is similar to Firefox's built-in Light theme, but without the issue present in this bug report.

Comment 6

[RagglenLove]

Attachment: 2019-07-17-180718_1366x768_scrot (minimal-light-theme-webext).png

Minimal Light Theme WebExt

Comment 7

[Kestrel]

STR:

1. Enable a dark system theme (eg Yaru-dark, Adwaita-dark) on Ubuntu 19.04.
2. In Firefox, enable the built-in light theme.
3. Press Ctrl+F to show findbar and search for a word that exists on the page.

The findbar text is white on white background and can only be read by highlighting it.

Comment 8

[Tim Nguyen :ntim]

So the problem here is that the urlbar and the searchbar use hsla(0,0%,100%,.8) and black as fallback respectively for toolbar background-color and color, while the findbar and usercontext.css both use -moz-Field and -moz-FieldText.

-moz-Field and -moz-FieldText are sensitive to the system theme, while the first ones are not. Not sure how to fix this correctly here, should we just use hsla(0,0%,100%,.8) and black as fallback everywhere ?

Comment 9

[Dão Gottwald [:dao]]

(In reply to Tim Nguyen :ntim from comment #8)

So the problem here is that the urlbar and the searchbar use hsla(0,0%,100%,.8) and black as fallback respectively for toolbar background-color and color, while the findbar and usercontext.css both use -moz-Field and -moz-FieldText.

-moz-Field and -moz-FieldText are sensitive to the system theme, while the first ones are not. Not sure how to fix this correctly here, should we just use hsla(0,0%,100%,.8) and black as fallback everywhere ?

Seems like we should set both toolbar_field and toolbar_field_text in the light theme? And the webextension theme framework should probably reject either property if the other one isn't set? I don't think there's a way to sanely fix this for all themes just with the fallback.

Comment 10

[Tim Nguyen :ntim]

(In reply to Dão Gottwald [::dao] from comment #9)

I don't think there's a way to sanely fix this for all themes just with the fallback.

I agree with your two other suggestions, but I think we should fix having 2 different fallbacks for the urlbar/searchbar and the findbar, I don't think that helps in terms of sanity either. Should the findbar just use hsla(0,0%,100%,.8) and black as fallback ?

Comment 12

[Emilio Cobos Álvarez (:emilio)]

This should work now.

Comment 13

[Kestrel]

Fixed by Bug 1634449.