feat: Restore top toolbar compact mode, b=no-bug, c=tabs, compact-mode, common

src/zen/common/ZenCustomizableUI.sys.mjs

@@ -70,7 +70,8 @@ export var ZenCustomizableUI = new (class {
           <toolbarbutton id="zen-toggle-compact-mode"
             class="toolbarbutton-1"
             command="cmd_toggleCompactModeIgnoreHover"
-            data-l10n-id="zen-toggle-compact-mode-button" />
+            data-l10n-id="zen-toggle-compact-mode-button"
+            removable="true" />
           <html:div id="zen-sidebar-top-buttons-separator" skipintoolbarset="true" overflows="false"></html:div>
         </hbox>
       </toolbar>

src/zen/common/ZenUIManager.mjs

@@ -1049,7 +1049,7 @@ var gZenVerticalTabsManager = {
         topButtons.prepend(windowButtons);
       }
 
-      if (!isSingleToolbar && isCompactMode) {
+      if ((!isSingleToolbar && isCompactMode) || !isSidebarExpanded) {
         navBar.prepend(topButtons);
       }
 
@@ -1091,6 +1091,7 @@ var gZenVerticalTabsManager = {
         appContentNavbarContaienr.append(windowButtons);
       }
 
+      gZenCompactModeManager.updateCompactModeContext(isSingleToolbar);
       this.recalculateURLBarHeight();
 
       // Always move the splitter next to the sidebar

src/zen/common/styles/zen-browser-ui.css

@@ -311,3 +311,10 @@
     opacity: 1;
   }
 }
+
+#zen-appcontent-navbar-wrapper #zen-sidebar-top-buttons {
+  max-width: fit-content;
+  :root[zen-right-side='true'] & {
+    order: 999;
+  }
+}

src/zen/common/styles/zen-theme.css

@@ -210,6 +210,10 @@
 
   --zen-workspace-indicator-height: 46px;
 
+  &:not([zen-sidebar-expanded='true']) {
+    --zen-workspace-indicator-height: 38px;
+  }
+
   --toolbar-field-color: var(--toolbox-textcolor) !important;
 
   &[zen-private-window='true'] {