Closed Bug 1172890 Opened 5 years ago Closed 4 years ago

[UX][Windows 10] Can't tell when window is unfocused if titlebar is off

Categories

(Firefox :: Theme, defect, P4)

Unspecified
Windows 10
defect

Tracking

()

VERIFIED FIXED
Firefox 51
Tracking Status
firefox48 --- wontfix
firefox49 --- wontfix
firefox50 --- fixed
firefox51 --- verified

People

(Reporter: Gijs, Assigned: jaws)

References

(Blocks 1 open bug)

Details

(Keywords: regression)

Attachments

(2 files, 1 obsolete file)

As in summary. The titlebar color doesn't change for classic windows apps, only the foreground color of the text in it, but text in the tabs in the titlebar doesn't change color in Firefox.

Hopefully the new designs here will fix this?
Seems like we should have some kind of design here... maybe we can dim the grey background, maybe we can dim the icons/urlbar/tab text... something. :-)
Blocks: 1173357
No longer blocks: windows-10
Summary: [Windows 10] Can't tell when window is unfocused if titlebar is off → [UX][Windows 10] Can't tell when window is unfocused if titlebar is off
(In reply to :Gijs Kruitbosch from comment #1)
> Seems like we should have some kind of design here... maybe we can dim the
> grey background, maybe we can dim the icons/urlbar/tab text... something. :-)

I like dimming the icons. I am kind of waiting a little bit to see if MS does something beyond just de-emphasizing the border highlight.
Gijs, can you explain why you marked this bug as blocking bug 1173357?
Flags: needinfo?(gijskruitbosch+bugs)
(In reply to (Limited avail. until June 16)  Jared Wein [:jaws] (please needinfo? me) from comment #3)
> Gijs, can you explain why you marked this bug as blocking bug 1173357?

Copy-paste fail, meant bug 1158143.
Blocks: theme-win10
No longer blocks: 1173357
Flags: needinfo?(gijskruitbosch+bugs)
Priority: -- → P2
Priority: P2 → P3
(In reply to Stephen Horlander [:shorlander] (Away until 7/20) from comment #2)
> I am kind of waiting a little bit to see if MS
> does something beyond just de-emphasizing the border highlight.

They still don't, right?
Flags: firefox-backlog+
Keywords: uiwanted
Downgrading the priority further since I think we're consistent with the general Windows 10 design.
Priority: P3 → P4
OS: Unspecified → Windows 10
We could fade out the UI a little bit to make it more obvious it is in the background. Kind of subtle but would help.
Flags: needinfo?(philipp)
Yeah, I agree that this would help!
Flags: needinfo?(philipp)
Bug 1196266 might be related here. At least I assumed a colored titlebar would change state in the background, but I just checked and it doesn't on Win10 RTM. Does the extended support for this in newer previews do anything different?
No longer blocks: 1192839
Depends on: 1269120
Looks like people are still finding the window/title bar status hard to interpret (since Firefox 40).  Stephen, do you want to take this bug and change the theme maybe for Firefox 49 or even 48?  I don't think we need to track it, but since it came up in another bug report it seems potentially good to fix.
Flags: needinfo?(shorlander)
(In reply to Liz Henry (:lizzard) (needinfo? me) from comment #10)
> Looks like people are still finding the window/title bar status hard to
> interpret (since Firefox 40).  Stephen, do you want to take this bug and
> change the theme maybe for Firefox 49 or even 48?  I don't think we need to
> track it, but since it came up in another bug report it seems potentially
> good to fix.

I don't have the time to make a patch for this, but if someone else does I think the design in comment 7 would be a good improvement.
Flags: needinfo?(shorlander)
No longer depends on: 1269120
Duplicate of this bug: 1269120
Attached patch Patch (obsolete) — Splinter Review
Assignee: nobody → jaws
Status: NEW → ASSIGNED
Attachment #8749747 - Flags: review?(dao+bmo)
Comment on attachment 8749747 [details] [diff] [review]
Patch

>+          #navigator-toolbox .toolbarbutton-icon:-moz-window-inactive,
>+          #navigator-toolbox .dropmarker-icon:-moz-window-inactive {
>+            opacity: .5;
>+          }

This makes it pretty impossible to differentiate between enabled buttons and disabled ones.

Also, why restrict this to #navigator-toolbox?
Attachment #8749747 - Flags: review?(dao+bmo) → review-
I set this rule on #navigator-toolbox so it will affect all of the browser chrome at the top of the window as well as to multiply any opacity rules that will be in effect for disabled buttons.

I also played with using `filter: blur(1px);` to give the background window a Gaussian blur which has a nice effect but it's not often seen on Windows.
Attachment #8749747 - Attachment is obsolete: true
Comment on attachment 8772639 [details]
Bug 1172890 - Reduce the opacity of the tab label in inactive windows to make background windows more obvious that they are not the foreground window.

Considering that Windows 10 by default does almost nothing here, and considering how Windows has handled this in the past, this effect seems too strong to me. It feels alien. IMHO we should just adjust the titlebar color.
Attachment #8772639 - Flags: review?(dao+bmo) → review-
Comment on attachment 8772639 [details]
Bug 1172890 - Reduce the opacity of the tab label in inactive windows to make background windows more obvious that they are not the foreground window.

Review request updated; see interdiff: https://reviewboard.mozilla.org/r/65388/diff/1-2/
Attachment #8772639 - Attachment description: Bug 1172890 - Fade out unfocused windows on Windows 10 to make a bigger distinction between the foregrounded window and background windows. → Bug 1172890 - Reduce the opacity of the tab label and favicon in inactive windows to make background windows more obvious that they are not the foreground window.
Attachment #8772639 - Flags: review- → review?(dao+bmo)
Comment on attachment 8772639 [details]
Bug 1172890 - Reduce the opacity of the tab label in inactive windows to make background windows more obvious that they are not the foreground window.

If we want to be consistent with Explorer, I think I'd prefer fading only the labels and not the icons. Fading all tab contents still feels a bit macOS-y to me. It's also somewhat inconsistent because e.g. the new tab button right next to the tabs isn't faded, which looks odd.

Secondly, :root is in theory cheaper than #main-window, because IDs aren't actually guaranteed to be unique, so ID selectors are treated just like class selectors under the hood.

You should also put :-moz-window-inactive in the end.

So, to sum it up:

:root[tabsintitlebar] .tab-label:-moz-window-inactive
Attachment #8772639 - Flags: review?(dao+bmo) → review+
(In reply to Dão Gottwald [:dao] from comment #20)
> Secondly, :root is in theory cheaper than #main-window, because IDs aren't
> actually guaranteed to be unique, so ID selectors are treated just like
> class selectors under the hood.

Also filed bug 1292878.
Comment on attachment 8772639 [details]
Bug 1172890 - Reduce the opacity of the tab label in inactive windows to make background windows more obvious that they are not the foreground window.

Review request updated; see interdiff: https://reviewboard.mozilla.org/r/65388/diff/2-3/
Attachment #8772639 - Attachment description: Bug 1172890 - Reduce the opacity of the tab label and favicon in inactive windows to make background windows more obvious that they are not the foreground window. → Bug 1172890 - Reduce the opacity of the tab label in inactive windows to make background windows more obvious that they are not the foreground window.
Attachment #8772639 - Flags: review+ → review?(dao+bmo)
Comment on attachment 8772639 [details]
Bug 1172890 - Reduce the opacity of the tab label in inactive windows to make background windows more obvious that they are not the foreground window.

Not sure why mozreview changed this back to r?, especially since bug 1195661 exists.
Attachment #8772639 - Flags: review?(dao+bmo) → review+
https://hg.mozilla.org/integration/fx-team/rev/019bbc497f9ed565fda0de3479d2b6af015f5f83
Bug 1172890 - Reduce the opacity of the tab label in inactive windows to make background windows more obvious that they are not the foreground window. This matches closer to how Windows works, because when we draw our tabs in the titlebar then it makes sense to treat them similar to how titlebars of other apps work. For example, Windows Explorer has their titlebar content with less strength when in the background. r=dao
https://hg.mozilla.org/mozilla-central/rev/019bbc497f9e
Status: ASSIGNED → RESOLVED
Closed: 4 years ago
Resolution: --- → FIXED
Target Milestone: --- → Firefox 51
I have reproduced this bug with Nightly 41.0a1(2015-06-09) on Windows 10, 64 bit!

The Bug's fix is now verified on latest Nightly 51.0a1

Build ID 	20160811030201
User Agent 	Mozilla/5.0 (Windows NT 10.0; WOW64; rv:51.0) Gecko/20100101 Firefox/51.0

[bugday-20160810]
(In reply to Liz Henry (:lizzard) (needinfo? me) from comment #14)
> We could uplift as far as aurora too.

Jared, do we want to uplift this to aurora?
Flags: needinfo?(jaws)
Comment on attachment 8772639 [details]
Bug 1172890 - Reduce the opacity of the tab label in inactive windows to make background windows more obvious that they are not the foreground window.

Approval Request Comment
[Feature/regressing bug #]: Windows 10 support
[User impact if declined]: hard to tell which Firefox window is in the foreground and which is in the background
[Describe test coverage new/current, TreeHerder]: simple CSS change, no automated tests
[Risks and why]: none
[String/UUID change made/needed]: none
Flags: needinfo?(jaws)
Attachment #8772639 - Flags: approval-mozilla-aurora?
Comment on attachment 8772639 [details]
Bug 1172890 - Reduce the opacity of the tab label in inactive windows to make background windows more obvious that they are not the foreground window.

Fix for a regression on win10, CSS only, low risk, verified on Nightly, Aurora50+
Attachment #8772639 - Flags: approval-mozilla-aurora? → approval-mozilla-aurora+
QA Whiteboard: [good first verify]
You need to log in before you can comment on or make changes to this bug.