[feature request] Add customisable background color for group-tab.html

[chzesa]

Short description

The background color of dummy tabs (group-tab.html) cannot be easily changed from the blinding white. A color picker would be appreciated, or have group-tab.html respect --tabbar-bg css variable.

Environment

• Version (or revision) of Tree Style Tab: 2.0.7.5527

[piroor]

Sorry I forgot to set default BG color for the page. Now it has ThreeDFace system color background.

Currently I have no idea to implement color picker for dummy tabs, but you can change its background color via userContent.css (not userChrome.css) like:

@-moz-document regexp("moz-extension://.+/resources/group-tab.html.*") {
  :root {
    background: red !important;
  }
}

[LucKy-4U]

Sorry I forgot to set default BG color for the page. Now it has ThreeDFace system color background.

Currently I have no idea to implement color picker for dummy tabs, but you can change its background color via userContent.css (not userChrome.css) like:

@-moz-document regexp("moz-extension://.+/resources/group-tab.html.*") {
  :root {
    background: red !important;
  }
}

This isn't working for me, I added it in userContent.css just like you mentioned.
This is supposed to change the background color of the TreeStyleTab? correct?

[piroor]

Did you activate user stylesheets via about:config? Not only userChrome.css but userContent.css also requires manual activation on Firefox 69 and later. See also: https://github.com/piroor/treestyletab/wiki/Code-snippets-for-custom-style-rules#on-firefox-69-and-later

[LucKy-4U]

well, there is only one stylesheets settings in about:config?
I can't find a separate settings for userContent.css.
here is how my firefox looks like:

Here is the content of my userContent.css:

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document regexp("moz-extension://.+/resources/group-tab.html.*") {
  :root {
    background: red !important;
  }
}

my firefox version is 70.
my TSS version is 3.3.5
I am using Ubuntu 16.4 LTS.

[piroor]

Yes. The single option affects to both userChrome.css and userContent.css.

[LucKy-4U]

Yes. The single option affects to both userChrome.css and userContent.css.

but as you can see in the image I shared, it didn't change the background color of treestyletab. :(
Are you sure that that code works? because until now whatever I have tried out of all your code snippets have worked perfectly well for me except this.
also, any idea what I could do to fix this issue?

[piroor]

Please look at the title of this issue, the CSS rule example for userContent.css is aimed to be applied to "group" tabs (you can see it via the URI ext+treestyletab:group.), not to the sidebar.

Basically you need to use the "custom user stylesheet" field in TST's options page to customize appearance of the sidebar. And rules for the sidebar may be different from the one for the "group tab" page. You can look how TST applies style definitions to the sidebar with CSS files under the directory: https://github.com/piroor/treestyletab/tree/master/webextensions/sidebar/styles

[LucKy-4U]

Please look at the title of this issue, the CSS rule example for userContent.css is aimed to be applied to "group" tabs (you can see it via the URI ext+treestyletab:group.), not to the sidebar.

Basically you need to use the "custom user stylesheet" field in TST's options page to customize appearance of the sidebar. And rules for the sidebar may be different from the one for the "group tab" page. You can look how TST applies style definitions to the sidebar with CSS files under the directory: https://github.com/piroor/treestyletab/tree/master/webextensions/sidebar/styles

oops, sorry, I didn't know what grouptabs were, I thought it meant the grouping of the tabs by treestyletab inside the sidebar. My bad.

I can't find the "custom user stylesheet" field anywhere. I do see the "Extra Style Rules for sidebar Contents" field though, is that what you meant?

Thanks for the link. :)

[piroor]

I can't find the "custom user stylesheet" field anywhere. I do see the "Extra Style Rules for sidebar Contents" field though, is that what you meant?

Oops, sorry. Yes that is it.

[LucKy-4U]

I can't find the "custom user stylesheet" field anywhere. I do see the "Extra Style Rules for sidebar Contents" field though, is that what you meant?

Oops, sorry. Yes that is it.

ok, thanks. I will look into it.