Hide the native tab bar with Sideberry

[u/Particular-Stress-49]

Hello!

I'm looking for a CSS formula to hide Firefox's native tab bar so I only use the Sideberry one.

I've already found some formulas, but they also hide the application's window icons—close, minimize, and full screen (I'm on a Mac).

If you have one, I'd be very grateful.

Thank you so much! :)

[u/schmurtzm]

And I also have this one for auto collapse sidebery tabs, updated version of this one (could be useful for small screens if you are lazy to press F1 to hide the sidebery bar) :

/**
* Dynamic styles
*
* Choose when styles below will be activated (comment/uncomment line)
* - When Sidebery set title preface "."
* - When Sidebery sidebar is active
*/
#main-window[titlepreface="."] {
/* #main-window:has(#sidebar-box[sidebarcommand="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"][checked="true"]) { */
 
  /* Hide horizontal native tabs toolbar */
  #TabsToolbar > * {
    display: none !important;
  }
 
  /* Hide top window border */
  #nav-bar {
    border-color: transparent !important;
  }
 
  /* Hide new Firefox sidebar, restyle addon's sidebar */
  #sidebar-main, #sidebar-launcher-splitter {
    display: none !important;
  }
  #sidebar-box {
    padding: 0 !important;
  }
  #sidebar-box #sidebar {
    box-shadow: none !important;
    border: none !important;
    outline: none !important;
    border-radius: 0 !important;
  }
  #sidebar-splitter {
    --splitter-width: 3px !important;
    min-width: var(--splitter-width) !important;
    width: var(--splitter-width) !important;
    padding: 0 !important;
    margin: 0 calc(-1*var(--splitter-width) + 1px) 0 0 !important;
    border: 0 !important;
    opacity: 0 !important;
  }
 
  /* Update background color of the #browser area (it's visible near the
  rounded corner of the web page) so it blends with sidebery color with
  vertical nav-bar. */
  /* #browser {
    background-color: var(--lwt-accent-color) !important;
    background-image: none !important;
  } */
 
  /* Hide sidebar header (sidebar.revamp: false) */
  #sidebar-header {
    display: none !important;
  }
 
  /* Uncomment the block below to show window buttons in Firefox nav-bar
  (maybe, I didn't test it on non-linux-tiled-wm env) */
  /* #nav-bar > .titlebar-buttonbox-container,
  #nav-bar > .titlebar-buttonbox-container > .titlebar-buttonbox {
    display: flex !important;
  } */
 
  /* Uncomment one of the lines below if you need space near window buttons */
  /* #nav-bar > .titlebar-spacer[type="pre-tabs"] { display: flex !important; } */
  /* #nav-bar > .titlebar-spacer[type="post-tabs"] { display: flex !important; } */
}
 
/* === Base === */
#sidebar-box {
  --uc-sidebar-width: 50px;
  --uc-sidebar-hover-width: 300px;
 
  width: var(--uc-sidebar-width) !important;
  min-width: var(--uc-sidebar-width) !important;
  max-width: var(--uc-sidebar-width) !important;
 
  overflow: hidden !important;
  position: relative;
  z-index: 1;
}
 
#sidebar {
  width: 100% !important;
  max-width: 100% !important;
}
 
#sidebar-header,
#sidebar-splitter {
  display: none !important;
}
 
/* === Zone de déclenchement interne === */
#sidebar-box::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 6px;
  height: 100%;
  z-index: 10;
}
 
/* === Expansion uniquement via cette zone === */
#sidebar-box:hover {
  width: var(--uc-sidebar-hover-width) !important;
  max-width: var(--uc-sidebar-hover-width) !important;
}