MozillaZine


Hide single tabs in userchrome.css in Firefox version 103.0?

User Help for Mozilla Firefox
Burma
 
Posts: 29
Joined: June 15th, 2007, 12:35 pm

Post Posted July 27th, 2022, 10:34 am

Up until Firefox version 103.0, the following worked in my userchrome.css file:

Code: Select all
    /* Set --tab-min-height to 0px so tab bar can disappear */
    #tabbrowser-tabs {
    –tab-min-height: 0px;
    }

    /* Restore minimum height when more than one tab */
    #tabbrowser-tabs tab {
    min-height: var(–hidetabs-tab-min-height);
    }

    /* Collapse tab bar when there is only one tab (tab is both first & last) */
    #tabbrowser-tabs tab[first-visible-tab=“true”][last-visible-tab=“true”] {
    visibility: collapse;
    }

    /* Hide the New Tab button when there is only one tab (first visible tab is
    adjacent to new tab button) */
    #tabbrowser-tabs tab[first-visible-tab=“true”] + #tabs-newtab-button {
    visibility: collapse;
    }

The purpose of it is to hide a tab if it’s the only one in the window. For some reason, it stopped working in Firefox version 103.0. Can anyone tell me why?

morat
 
Posts: 5302
Joined: February 3rd, 2009, 6:29 pm

Post Posted July 27th, 2022, 11:28 am

Use the normal quote character. Don't use the left and right quote characters.

Unicode quote characters
http://www.fileformat.info/info/unicode/char/0022/index.htm
http://www.fileformat.info/info/unicode/char/201c/index.htm
http://www.fileformat.info/info/unicode/char/201d/index.htm

Where is the --hidetabs-tab-min-height variable defined? That variable isn't found in the Fx 102 source.

Reference
http://searchfox.org/mozilla-esr102/search?q=hidetabs-tab-min-height
http://searchfox.org/mozilla-esr102/search?q=tab-min-height

Try this:

Code: Select all
#tabbrowser-tabs {
  min-height: 0px !important;
}
#tabbrowser-tabs tab {
  min-height: 0px !important;
}
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] {
  visibility: collapse !important;
}
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] + #tabbrowser-arrowscrollbox-periphery > #tabs-newtab-button {
  visibility: collapse !important;
}

Burma
 
Posts: 29
Joined: June 15th, 2007, 12:35 pm

Post Posted July 27th, 2022, 12:24 pm

Nope, I tried your code and it still doesn't work. I disabled all extensions and have toolkit.legacyUserProfileCustomizations.stylesheets = true.

Does it work for you? Thanks

morat wrote:Use the normal quote character. Don't use the left and right quote characters.

Unicode quote characters
http://www.fileformat.info/info/unicode/char/0022/index.htm
http://www.fileformat.info/info/unicode/char/201c/index.htm
http://www.fileformat.info/info/unicode/char/201d/index.htm

Where is the --hidetabs-tab-min-height variable defined? That variable isn't found in the Fx 102 source.

Reference
http://searchfox.org/mozilla-esr102/search?q=hidetabs-tab-min-height
http://searchfox.org/mozilla-esr102/search?q=tab-min-height

Try this:

Code: Select all
#tabbrowser-tabs {
  min-height: 0px !important;
}
#tabbrowser-tabs tab {
  min-height: 0px !important;
}
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] {
  visibility: collapse !important;
}
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] + #tabbrowser-arrowscrollbox-periphery > #tabs-newtab-button {
  visibility: collapse !important;
}

morat
 
Posts: 5302
Joined: February 3rd, 2009, 6:29 pm

Post Posted July 27th, 2022, 1:04 pm

It works I guess, but I didn't compare the style between Fx 102 and Fx 103.

All the selectors work when I use background-color as a test.

For example:

Code: Select all
#tabbrowser-tabs {
  background-color: lime !important;
}
#tabbrowser-tabs tab {
  background-color: pink !important;
}
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] {
  background-color: orange !important;
}
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] + #tabbrowser-arrowscrollbox-periphery > #tabs-newtab-button {
  background-color: cyan !important;
}

Also, I don't understand the following entry.

Code: Select all
#tabbrowser-tabs {
  -–tab-min-height: 0px;
}

The --tab-min-height variable is defined on the :root pseudo-class in the source. I never try to redefine a variable like that.

Using CSS variables
http://developer.mozilla.org/docs/Web/CSS/Using_CSS_custom_properties

Return to Firefox Support


Who is online

Users browsing this forum: No registered users and 10 guests