Hide the default tab strip

[eoger]

Probably the biggest and most important blocker. Bug at https://bugzilla.mozilla.org/show_bug.cgi?id=1332447

[FrobtheBuilder]

By the way, I fixed up @mmastrac's macOS solution to work properly with the latest nightly.

@namespace xul url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
@-moz-document url("chrome://browser/content/browser.xhtml") {
  #TabsToolbar * {
    background-color: var(--toolbar-bgcolor)
  }
  #TabsToolbar {
    height: 40px;
  }
  #tabbrowser-tabs[orient="horizontal"] { visibility: collapse !important; }
  #main-window:not([drawtitle="true"]):not([inFullscreen="true"]) #nav-bar {
        position: absolute !important; top: 0; left: 0; right: 0; margin-left: 74px; margin-right: 32px
  }
  #main-window:not([drawtitle="true"]):not([inFullscreen="true"]) #navigator-toolbox { background-color: var(--toolbar-bgcolor) }
  #main-window:not([drawtitle="true"]):not([inFullscreen="true"]) #PersonalToolbar { margin-top: 14px }
  #PanelUI-button { position: absolute; right: -32px; top: 0 }
  #sidebar-box[sidebarcommand="_0ad88674-2b41-4cfb-99e3-e206c74a0076_-sidebar-action"] sidebarheader { visibility: collapse !important; }
  hbox#nav-bar-customization-target {
    width: 100%;
    padding-right: 10px;
  }
  toolbaritem#PanelUI-button {
    margin-top: 5px !important;
  }
}

Note: this only works if you don't have an overflow menu. If you do, you can probably set that width: 100% to something slightly less using calc to make room for it. I'm trying to figure out a better solution.

[FrobtheBuilder]

@ariasuni https://developer.mozilla.org/en-US/docs/Web/CSS/@document

I assume it restricts the styles to only the browser chrome document, just in case the selectors might conflict with page content, I guess.

[ariasuni]

Right, I thought it was some XUL/XML thingy and not CSS.

@namespace xul is probably not necessary though (and even more probably if the document is an xhtml), right?

[martinthomson]

This is working for me on Win10 as the simplest possible fix:

#toolbar-menubar[inactive="true"] + #TabsToolbar {
  visibility: collapse !important;
  margin-bottom: 0;
}
#titlebar {
  margin-bottom: calc(-1 * var(--tab-min-height)) !important;
}
#toolbar-menubar + #TabsToolbar {
  margin-bottom: var(--tab-min-height) !important;
}

#sidebar-box[sidebarcommand="_0ad88674-2b41-4cfb-99e3-e206c74a0076_-sidebar-action"] sidebarheader { visibility: collapse !important; }

It doesn't look great when I choose "touch" density in the customize menu, but it is otherwise OK. I suspect that some of the other hacks won't work with the recent changes in Nightly, which is what motivated me to try fixing this.

[ariasuni]

As stated in the Tab Center Reborn wiki, this works in all current versions:

#TabsToolbar:not([customizing="true"]) {
  visibility: collapse !important;
}
/* if the titlebar is also hidden and your browser is maximized,
 * clicking on the top pixel of the screen should trigger menu items (Fitt’s law) */
#toolbar-menubar {
  padding-top: 0px !important;
}

[FrobtheBuilder]

@ariasuni Your solution works, except on macOS at least it seems to hide the window buttons completely.

[ariasuni]

I wasn’t aware of that but that makes sense. Does setting browser.tabs.drawInTitlebar to false help with this? I would like to test it myself but it’s hard to make macOS work in Virtualbox…