Treestyletab: "Apply Browser Theme" not applying dark colors

[mruhlin]

Short description

Firefox ships with light and dark themes by default, and a "default" theme that can switch between them based on the user's OS-level dark mode settings (for mac OS at least, I'm not sure what other OSes support this).

Setting Tree Style Tab to "apply browser theme" doesn't seem to inherit any theme settings from those default themes though. It works fine with third party themes, but should work with the built in ones too (especially since Firefox does a good job of toggling when the OS toggles)

Steps to reproduce

1. Set mac OS for dark mode
2. Start Firefox with clean profile.
3. Install TST.
4. Go to TST preferences
5. Select "plain light" theme
6. make sure "Apply Browser Theme" is checked

Expected result

tabs should have dark background and light text

Actual result

tabs have light background and dark text

Environment

• Platform (OS): mac OS mojave 10.14.4
• Version of Firefox: 67.0
• Version (or revision) of Tree Style Tab: 3.1.1

[31j]

Issue is reproduceable on Windows 10 Pro, Firefox: 68 Beta 10, Tree Style Tab: 3.1.1, With the Vertigo theme, Tabs should have dark background and light text however tabs have light background with dark text instead.

Sorry that I don't have any information for even a "temp" fix, best of luck with the issue!

[sbr61]

GUI customization that can be done by addons seems to be rather limited in Firefox. This is the reason why people created ShadowFox.

What it does:

• It enables Firefox dark theme.
• It creates files userChrome.css and userContent.css in a folder chrome within your Firefox profile. These files are filled with CSS customization that Firefox will pick up on its startup. This will extend the Firefox dark theme, e.g. about:preferences will be dark, too, and much more.
• It has support for several addons. It analyzes which addons you have installed and copies CSS customization for those of your addons it supports to the CSS files mentioned above. When doing so, it will replace the addon IDs with the unique UUIDs on your system assigned to your addons so that the customization will be applied on Firefox startup.
• If you want to add own CSS, specify it in files userChrome_customization.css and userContent_customization.css in a sub-folder ShadowFox_customization of the chrome folder in your profile. (You get the path of your profile folder when you enter about:support in the Firefox address bar.) ShadowFox will copy the contents of these files over to the end of the userChrome.css and userContent.css files. This means you don't have to re-apply your changes whenever you execute ShadowFox again in order to add support for a newly installed addon.

Fortunately, ShadowFox does have support for TST. For me, the tab tree is completely dark with light text.

Actually, the text on discarded tabs was not light enough for my eyes. I fixed this by adding the following CSS to userContent_customization.css:

/*! Alters the webextension Tree Style Tab */
@-moz-document url-prefix("moz-extension://[email protected]/") {
  .tab.discarded {
    opacity: .70 !important
  }
  .tab.discarded .label {
    color: var(--in-content-page-color) !important
  }
}

After adding this, re-execute ShadowFox to get the CSS copied over to userContent.css with the correct replacement for the URL prefix.

[piroor]

Firefox doesn't notify color information to addons, if it is inherited from the platform. You need to choose "Dark", "Light", or other third party theme. Otherwise, Firefox Color addon helps you to choose colors manually. TST can apply theme colors on these cases.

[piroor]

Related bugs on Firefox:

• 1435216 - Return something useful for theme.getCurrent() when the default theme is applied
• 1542044 - browser.theme.getCurrent() should return dark theme in default theme in dark mode

[HugLifeTiZ]

Now that Firefox 68 is out, this option is broken for anyone who updates to it. It seems like it might be related to OS theming being blocked on webpages, which I guess TST technically is at the end of the day. I noticed that parts of pages that used to be dark due to my GTK theme weren't dark anymore.

[FichteFoll]

I can confirm this. I was using this option with the Arc-Dark theme and after updating to 68 my TST is bright. I guess the workaround is to downgrade until this is fixed in upstream?

Edit: Well, guess that didn't work out too well because FF doesn't want to reuse a profile that has been used with a higher version once.

[HugLifeTiZ]

I went to /r/FirefoxCSS about this, and apparently there is a new about:config option: widget.content.allow-gtk-dark-theme Set that to true then restart.

[jayywolff]

I went to /r/FirefoxCSS about this, and apparently there is a new about:config option: widget.content.allow-gtk-dark-theme Set that to true then restart.

[mruhlin]

Hey thanks for the info. I just got back around to looking at this, and I don't see a widget.content.allow-gtk-dark-theme anywhere in about:config. (using firefox version 68.0, which they say is the latest. Did they give us a fix and then take it away?

edit: I guess GTK is a linux thing, so maybe that option just isn't a thing for mac users.

[irvinm]

@mruhlin can you try again with the recent build?

[mruhlin]

Looks better! But.... on the latest build, it matches whichever theme the system has when firefox starts. If I toggle while firefox is running, FF automatically switches themes, but TST stays the same. Not sure if that counts as a separate issue or not.

1. Set mac os to dark mode
2. Launch Firefox
3. Note that TST is dark
4. Set mac OS to light mode
5. TST should be light but is still dark.
6. Close and reopen firefox
7. TST is now light
8. Switch OS back to dark mode
9. TST still light

[irvinm]

I just tried your exact sequence and in my case (Windows) the theme changes without having to restart Firefox. I will leave it to @piroor how he wants to handle that.

[mruhlin]

I've been clicking "remind me tomorrow" for a few months now about an osx update. Let me just double check if that changes anything...

[mruhlin]

Yeah no luck, works the same on latest mac os (10.15.1)

[irvinm]

Thanks for trying. Glad it at least works after restarting Firefox.

[HugLifeTiZ]

There was a short time when it was broken on Linux, but the 4 days ago update fixed it.

[piroor]

TST tries to mix some colors when the sidebar is loaded, to apply pale highlighted colors and other variations to hover/active tabs. Sorry that the latest released version of TST doesn't have any code to re-calculate colors when the system color scheme is changed dynamically and you need to close/reopen the sidebar to apply new colors completely for now.

Thus I've added a code to re-calculate colors dynamically at the commit 1832fb0. I hope it should fix the "some colors are remained with old color scheme" problem.

[irvinm]

@mruhlin does this work better for you with the latest version? If so, can you close this item?

[irvinm]

@piroor I am guessing we can close this.