[Enhancement] Workaround Firefox Nightly removing #titlebar

[tmarble]

Abstract

Firefox Nightly 133a1 (as of 8 October 2024) has removed #titlebar
which breaks the ability to hide the titlebar in userChrome.css per
https://github.com/piroor/treestyletab/wiki/Code-snippets-for-custom-style-rules#move-minimizerestoreclose-window-buttons-to-the-right-of-hamburger-menu-after-hiding-horizontal-tabs

#titlebar {
	appearance: none !important;
	height: 15px;
}

See also:

https://www.reddit.com/r/FirefoxCSS/comments/1fwr7k6/psa_for_people_testing_stuff_on_firefox_nightly/

Steps to see the situation

1. Start Firefox with clean profile.
2. Install TST.
3. Modify userChrome.css to hide the titlebar
4. Titlebar remains

Expected result

Titlebar should be removed per CSS.

Actual (present) result

Titlebar remains

Environment

• Platform (OS): Ubuntu 22.04 (Wayland)
• Version of Firefox: 133.0a1 (2024-10-10) (64-bit)
• Version (or revision) of Tree Style Tab: 4.0.23

[piroor]

userChrome.css is out of control of this project. I hope that code snippets for userChrome.css are maintained by people who use it.

[tmarble]

Hopefully folks that are clever enough to find a workaround will post the answer here. Closing.

[SHHSSH]

   :root[tabsintitlebar] #TabsToolbar {
       margin-top: calc(-1 * var(--tab-min-height));
   }

[SHHSSH]

@tmarble

[rixx]

The above didn't work for me, but this here did (running on Firefox Nightly 133a1 on the Oct 10 and Oct 15 builds):

#main-window #TabsToolbar {
    opacity: 0;
    max-height: 0px;
    pointer-events: none;
}

My previous CSS actually worked fine for hiding the tabs, but made any permission prompt (for microphone / webcam / notification permissions) flicker rapidly, making it impossible to hit (yes, even with rapid clicking). Just putting this in here in case others having the same problem are searching the issue tracker like I did (I realise it's not TST's fault, but people hiding their top tab bar might still search here for solutions 😉)

[tmarble]

Thanks @SHHSSH and @rixx !

For me the above proposed solution did not work either.

Ultimately this is the solution I found:

#toolbar-menubar {
    margin-top: -40px;
}

[SHHSSH]

Thanks @SHHSSH and @rixx !

For me the above proposed solution did not work either.

Ultimately this is the solution I found:

#toolbar-menubar {
    margin-top: -40px;
}

Anyway ya reckon I could make this dark?

And when I refresh a page with a hotkey on my mouse it'll trip out and flash all the tabs in white at the top too, hmm.

Have begun using @rixx's solution -

#main-window #TabsToolbar {
opacity: 0;
max-height: 0px;
pointer-events: none;
}

Thanks!