TreeStyleTab sidebar tabs only

example.md

Example:

userChrome.css

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

#navigator-toolbox {
  /* put titlebar and url bar next to each other */
  flex-direction: row;
  /* more places to allow dragging */
  -moz-window-dragging: drag;
  /* gives a native, blended look on macos */
  -moz-appearance: -moz-mac-vibrant-titlebar-dark !important;
}

#urlbar-container {
  /* more drag handles */
  -moz-window-dragging: drag;
}

#urlbar {
  /* but don't interfere with selecting text in the URL bar itself */
  -moz-window-dragging: no-drag;
}

#TabsToolbar {
  min-width: 90px;

  /* blend with macos titlebar color */
  background-color: transparent !important;
}

/* to hide the native tabs */
#TabsToolbar .toolbar-items {
  visibility: collapse;
}

/* to hide the treesyle tabs sidebar header */
#sidebar-header {
    visibility: collapse;
}

#nav-bar {
  /* flat style, to blend with native window */
  background-color: transparent !important;
  box-shadow: none !important;
  /* let it breathe */
  margin: 5px 0 !important;
  /* allow dragging from the padding around the nav bar */
  -moz-window-dragging: drag;
  /* expand to fill space not taken by #TabsToolbar */
  flex: 1;
}

/* contains private browsing badge and fullscreen button */
#titlebar-secondary-buttonbox {
  margin-left: 4px;
}

.titlebar-spacer[type="pre-tabs"] {
  display: none !important;
  border-inline-end: none !important;
}

.titlebar-spacer[type="post-tabs"] {
  width: 20px !important;
}

/* put a top-border on the main content rather than a bottom-border
   on the toolbar, because the toolbar has -moz-appearance: none; */
#content-deck {
  border-top: 1px solid #222222;
}

/* Dim the SSL lock and company just a tad so that the green color
   doesn't burn out my monitor... */
:root[lwt-toolbar-field-brighttext] #urlbar[pageproxystate="valid"] > #identity-box.verifiedIdentity > #identity-icon-labels {
  color: #75c365 !important;
}

Thanks for this gist, but it does not work with Bookmarks toolbar

This stopped working in FF 113.

They deprecated -moz-box-orient: horizontal for flex-direction: row, and -moz-box-flex is now simply flex.

Here are the two changes to make to get it working again:

   /* put titlebar and url bar next to each other */
-  -moz-box-orient: horizontal;
+  flex-direction: row;

   /* expand to fill space not taken by #TabsToolbar */
-  -moz-box-flex: 1000;
+  flex: 1000;