1397761 - [macOS] full screen button should be white on mavericks

Status: RESOLVED WONTFIX

(Firefox :: Theme, defect, P5)

Description

[Clément Lefèvre]

Attachment: Screenshot of the top of the window + the system bar

Since some times the default theme with Photon have changed on OS X, resulting in a black tab bar.

It looks like OS X 10.9 (Mavericks) can looks different compared to more recent ones.

See the joined screenshot to see the result.

I can note several problems:
- The grey/black/grey contrast between system bar, tab bar and url toolbar can be quite difficult to read in some conditions. Especially, Mavericks doesn't have dark system theme as Yosemite and earlier, so bar can only have this color. Contrast shouldn't be that abrupt in my humble opinion.

- In case color shouldn't change, the arrows to slide tabs when on the first or last tab, resulting in grey arrow, can be hard to see. The fullscreen button is even harder to see because only the very small white shadow is here: the button is black on black.

- Many favicons are black or with dark colors and transparent background, expecting that the tab will have a light color. Those favicons are almost impossible to see (for example the github one). Would it be possible, for example, to be able to replace transparency by light color for the inside of the icon at least?

Comment 1

[:Gijs (he/him)]

(In reply to Clément Lefèvre from comment #0)
> I can note several problems:
> - The grey/black/grey contrast between system bar, tab bar and url toolbar
> can be quite difficult to read in some conditions. Especially, Mavericks
> doesn't have dark system theme as Yosemite and earlier, so bar can only have
> this color. Contrast shouldn't be that abrupt in my humble opinion.

This was basically bug 1376313. I don't think we will change it.

> - In case color shouldn't change, the arrows to slide tabs when on the first
> or last tab, resulting in grey arrow, can be hard to see.

I don't know if the disabled state should be lighter, maybe Dão or someone else on the visual team can help clarify.

> The fullscreen
> button is even harder to see because only the very small white shadow is
> here: the button is black on black.

This is definitely a bug.

> - Many favicons are black or with dark colors and transparent background,
> expecting that the tab will have a light color. Those favicons are almost
> impossible to see (for example the github one). Would it be possible, for
> example, to be able to replace transparency by light color for the inside of
> the icon at least?

This is bug 1094357.

I'm morphing the summary of the bug to be about the tab scroll arrows and the fullscreen button.

Comment 2

[Markus Stange [:mstange]]

The fullscreen button can be made white by setting the attribute brighttitlebarforeground="true" on the window.

Comment 3

[Dão Gottwald [:dao]]

I expect bug 1404246 fixed the scroll buttons.

Comment 4

[Clément Lefèvre]

Attachment: Screenshot on 2017-10-19 - 14:29:05

For my part I don't see any color difference on tab scroll button besides having vertical lines delimiting them now. See the joined screenshot.

Comment 5

[Dão Gottwald [:dao]]

(In reply to Clément Lefèvre from comment #4)
> Created attachment 8920109 [details]
> Screenshot on 2017-10-19 - 14:29:05
> 
> For my part I don't see any color difference on tab scroll button besides
> having vertical lines delimiting them now. See the joined screenshot.

The scroll arrows look as expected to me.

Comment 6

[Dão Gottwald [:dao]]

Clément, does the following Try build fix the full screen button for you?

https://queue.taskcluster.net/v1/task/Pnyx6CEeSg-MlusjEx1eBw/runs/0/artifacts/public/build/target.dmg

Comment 7

[Clément Lefèvre]

(In reply to Dão Gottwald [::dao] from comment #6)
> Clément, does the following Try build fix the full screen button for you?
> 
> https://queue.taskcluster.net/v1/task/Pnyx6CEeSg-MlusjEx1eBw/runs/0/
> artifacts/public/build/target.dmg

Not exactly.
There's some king of glow border around the icon that does not look that clean.
And with this fix, the icon get almost the same issue and is very hard to see on the light theme: it uses very similar colors.
I'll add screenshots in the following comments.

In my opinion, it should use the same color as the "new tab" button or tab list/sliders.

Comment 8

[Clément Lefèvre]

Attachment: UI with the default theme

There's some bold glow border around the button, making it way too noticeable. It could instead be displayed the same way as the tabs command buttons left to it.

Comment 9

[Clément Lefèvre]

Attachment: UI with the dark theme

Same problem as the default theme. It could also use the color scheme of the buttons on the url bar.

Comment 10

[Clément Lefèvre]

Attachment: UI with the light theme

Here the problem is that the color are very similar, making it very hard to see and notice, and rsulting in having in the light theme the issue this patch intend to fix in default/dark ones.

Same remark as above: just using the color scheme of the "new tab" button would make it perfect I think.

Comment 11

[Markus Stange [:mstange]]

We could tone it down a little by setting a lower alpha than 1 at http://searchfox.org/mozilla-central/rev/7e090b227f7a0ec44d4ded604823d48823158c51/widget/cocoa/nsChildView.mm#2374

Comment 12

[Clément Lefèvre]

Attachment: UI with the dark theme with the master (normal) build

Oh, and investigating this issue, I noticed something else.
The joined screenshot was taken from the normal build (*not* the try one) on the dark theme.

While the tab bar is using the exact same color between default and dark theme, the fullscreen button is displayed differently between them. In the dark theme it have a little glow border making it easier to see, but not that nice on a design perspective either I think.

Comment 13

[Dão Gottwald [:dao]]

(In reply to Clément Lefèvre from comment #7)
> And with this fix, the icon get almost the same issue and is very hard to
> see on the light theme: it uses very similar colors.

We'd be willing to live with that since it only affects 10.9. However, since setting brighttitlebarforeground="true" alone doesn't seem to be sufficient here, I'm inclined to just wontfix this.

But if Markus wants to give this a try, that's also fine by me:

(In reply to Markus Stange [:mstange] from comment #11)
> We could tone it down a little by setting a lower alpha than 1 at
> http://searchfox.org/mozilla-central/rev/
> 7e090b227f7a0ec44d4ded604823d48823158c51/widget/cocoa/nsChildView.mm#2374

Comment 14

[Clément Lefèvre]

(In reply to Dão Gottwald [::dao] from comment #13)
> (In reply to Clément Lefèvre from comment #7)
> > And with this fix, the icon get almost the same issue and is very hard to
> > see on the light theme: it uses very similar colors.
> 
> We'd be willing to live with that since it only affects 10.9. However, since
> setting brighttitlebarforeground="true" alone doesn't seem to be sufficient
> here, I'm inclined to just wontfix this.
> 
> But if Markus wants to give this a try, that's also fine by me:
> 
> (In reply to Markus Stange [:mstange] from comment #11)
> > We could tone it down a little by setting a lower alpha than 1 at
> > http://searchfox.org/mozilla-central/rev/
> > 7e090b227f7a0ec44d4ded604823d48823158c51/widget/cocoa/nsChildView.mm#2374

As explained in comment 12, dark theme already have a different visual, it just looks a bit rough due to the glowing border that could I think be removed to have it look better.
Then, default theme could just use the exact same visual, as the tab bar have the exact same color.