Windows 7 minimize maximize close buttons hidden

[picollo7]

Describe the bug

In Windows 7 the minimize, maximize, and close buttons are covered by the background image in dark mode. They still work, but are not visible.

Expected behavior

The minimize, maximize, and close buttons should be visible.

Screenshots

Environment:

• Distribution
  • Original Lepton
  • Lepton's photon style
  • Lepton's proton style
• Firefox Version:
• OS:
  • Linux
  • Windows
  • Mac
  • Other:
• Theme:
  • Light
  • Dark
  • Alpenglow (System: Light)
  • Alpenglow (System: Dark)
  • System Default
    • GTK Theme Name (Linux only):
  • Other: (e.g. Photon Colors, Google Chrome Dark, Fairytale Of Nature)

Additional context

[black7375]

Would you like to upgrade to a lastest commit?

[jskm]

This issue is caused by changes in Firefox. I see it with Firefox 92 running on Windows 7 with Aero.

I tried earlier versions of Lepton until v1.0 before getting the titlebar buttons visible again. It is d16cd6d that makes the navigator-toolbox opaque and ends up blocking the titlebar buttons, but I've been using much newer versions than that without problems, so the difference had to be a Firefox update.

I downloaded Firefox 90, 91, and the 91.1 ESR, and narrowed down the change to sometime after 91.0.2. In fact, even unaltered, Firefox 92 and 91.1.0esr paint over the title bar buttons as shown in the second image here:

Firefox 91.0.2:

Firefox 91.1.0esr:

While toggling properties in the Browser Toolbox, I found that everything went back to normal, even having Aero transparency in the title bar again, after removing this setting introduced in d16cd6d:

Firefox-UI-Fix/userChrome.css

Lines 80 to 82 in a96fab2

	:root:not([lwtheme-image]) #navigator-toolbox:-moz-lwtheme {
	background-color: var(--lwt-accent-color) !important;
	}

Lepton, fixed:

It seems #TabsToolbar { background-image: unset !important } is what removes the broken coloration of the tab bar seen in default Firefox. To change the background of the tab bar as before, you'd have to be able to cut out a transparent region over the title bar buttons.

[black7375]

Based on the latest commit, the symptom does not appear at my VM.

[jskm]

I downloaded the portable version of Firefox 92, ran it, and then installed the latest commit for Lepton. Without Lepton, the tab bar has the white overlay painted over the title bar buttons, as shown in my previous screenshot. With Lepton, it looks correct with Aero transparency and visible system buttons, until I go to Customize Toolbar -> Themes and choose the Light or Dark theme. Then the system buttons are painted over completely.

It turns out that the "System theme" setting works correctly, but I've never used it because it is light-themed on Windows 7. The Firefox Dark theme still does not seem to work, showing the problem as described in the first post. I've just discovered the ui.systemUsesDarkTheme option in combination with the Firefox System theme which does work as intended. Though it seems there's transparency if ui.systemUsesDarkTheme is set for light mode, and solid color when set to dark.

[black7375]

Looks like I found a workaround yesterday.
https://www.reddit.com/r/waterfox/comments/qk0rjz/waterfox_g4_themes/hjakxzs/?context=3

Download ff_win7_darkmode.reg and double-clicking on it.

Does it works?

[Kiki79250CoC]

OK. This reg fix partially fixes the problem. Let me explain.

• When I use the System theme, It works (Image 1)
• When I use one of the newest theme introduced with Firefox 94, it Works (Image 2 & 3)
• But When I use the "full" Dark and Light theme, it doesn't work (Image 4 & 5).

(Image 1 :)

(Image 2 :)

Image 3 :)

(Image 4 :)

(Image 5 :)

I remember that before Firefox 89, only tabs back have the color, leaving the whole window have the Aero (Here in Firefox 90.0.2 with Ptoton Disabled) :

[black7375]

@Kiki79250CoC

Thank you very much for doing a lot of testing.
Can you attach the about:support - Copy text to clipboard information for reproduction?

[Kiki79250CoC]

Here is the content of the clipboard after clicking the button :
(if you can't find the info I snapped the whole page here : about config page.zip)

  <h2 xmlns="http://www.w3.org/1999/xhtml" class="major-section" data-l10n-id="app-basics-title">Paramètres de base de l’application</h2>

Nom	Firefox
94.0.2
20211119140621

release
Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:94.0) Gecko/20100101 Firefox/94.0
Windows_NT 6.1 7601
Activé
1/1
0/1 Désactivées par défaut
11
Inactives
Présente
Présente
Présente
false

<!--EndFragment-->

[black7375]

I just tried it, and the pasting comes out weird.
I'm sorry, but can you do it again with Copy raw data to clipboard?

[Kiki79250CoC]

I put the raw data in a text file :
Raw data.txt

[black7375]

Reproducibility is quite difficult.

However, once I applied a patch that could solve it. 8a8351d
I'm not sure if it can be solved. A test is required.

[Kiki79250CoC]

OK. So it didn't fixed the problem, BUT I think I know why...

On those two color schemes, the default Light and Dark Themes have the white "gradient" which overlaps the window frame (and the buttons with) :

And when I use an alternative theme (like Alpenglow or one of the themes introduced with Firefox 94), the overlapping is not present at all :

So I think this problem is not from Lepton, but from Firefox itself.
EDIT : I found the BugZilla ticket concerning this problem.

---

For the moment I can suggest you a workaround.
Coloring only the back of inactive tabs like original Firefox 88 and completly remove the back calque like the System Theme. (Image 1 of the previous post)

[black7375]

I followed the color-way renders.
This time, I predict that the symptoms will probably go away.

---

I was working on following the default theme of Win7, but found that it was not applied in color-way.

If an option system is adopted in the future, we are going to add an option to forcibly activate the Win7 default like theme.
(Just for memo)

/*= Windows 7, 8 - Tab Bar Background *****************************************/
@media (-moz-os-version: windows-win7) {
  /* Header Color */
  :root:not([lwtheme-image]):-moz-lwtheme #menubar-items,
  :root:not([lwtheme-image]):-moz-lwtheme .tab-background:not([selected], [multiselected]),
  :root:not([lwtheme-image]):-moz-lwtheme #titlebar .toolbarbutton-1 > .toolbarbutton-icon,
  :root:not([lwtheme-image]):-moz-lwtheme #alltabs-button > .toolbarbutton-badge-stack,
  #scrollbutton-up:-moz-lwtheme,
  #scrollbutton-down:-moz-lwtheme {
    background-color: var(--lwt-accent-color) !important;
  }

  :root:not([lwtheme-image]):-moz-lwtheme .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected], [multiselected]),
  :root:not([lwtheme-image]):-moz-lwtheme #titlebar .toolbarbutton-1:hover > .toolbarbutton-icon,
  :root:not([lwtheme-image]):-moz-lwtheme #alltabs-button:hover > .toolbarbutton-badge-stack,
  #scrollbutton-up:-moz-lwtheme:hover,
  #scrollbutton-down:-moz-lwtheme:hover {
    background-color: color-mix(in srgb, currentColor 15%, var(--lwt-accent-color)) !important;
  }
  :root:not([lwtheme-image]):-moz-lwtheme #titlebar .toolbarbutton-1:is([open], :hover:active) > .toolbarbutton-icon,
  :root:not([lwtheme-image]):-moz-lwtheme #alltabs-button:is([open], :hover:active) > .toolbarbutton-badge-stack,
  #scrollbutton-up:-moz-lwtheme:hover:active,
  #scrollbutton-down:-moz-lwtheme:hover:active {
    background-color: color-mix(in srgb, currentColor 20%, var(--lwt-accent-color)) !important;
  }

  #TabsToolbar:-moz-lwtheme {
    color: var(--lwt-text-color) !important;
  }

  /* Remove Aero */
  #TabsToolbar {
    /* Original: radial-gradient(eclipse at bottom, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.5) 80%, transparent) */
    background-image: unset !important;
  }
}
@media (-moz-os-version: windows-win8) {
  /* Header Color */
  :root:not([lwtheme-image]):-moz-lwtheme {
    background-color: var(--lwt-accent-color) !important;
  }

  #navigator-toolbox:-moz-lwtheme {
    color: var(--lwt-text-color) !important;
  }
}

[Kiki79250CoC]

Installed the updated version, and it seems to be finally fixed! (Firefox 95)

Light Theme :

Dark Theme :

[black7375]

@Kiki79250CoC
Thank you very much for participating in the issue and testing every time!!