From ae5c1641795b662e44d30449bc926c8fd476bc76 Mon Sep 17 00:00:00 2001
From: "mr. M" <mauro.balades@tutanota.com>
Date: Sat, 21 Dec 2024 22:17:31 +0100
Subject: [PATCH] Add experimental window controls preference and improve
 compact mode sidebar handling

---
 src/browser/app/profile/zen-browser.js                |  1 +
 .../zen-styles/zen-tabs/vertical-tabs-topbar.inc.css  | 11 ++++++++++-
 src/browser/base/zen-components/ZenCompactMode.mjs    | 11 +++++++++--
 3 files changed, 20 insertions(+), 3 deletions(-)

diff --git a/src/browser/app/profile/zen-browser.js b/src/browser/app/profile/zen-browser.js
index 673843bfc..049e11e0b 100644
--- a/src/browser/app/profile/zen-browser.js
+++ b/src/browser/app/profile/zen-browser.js
@@ -138,6 +138,7 @@ pref('zen.view.sidebar-collapsed.hide-mute-button', true);
 pref('zen.view.experimental-force-window-controls-left', false);
 
 pref('zen.view.hide-window-controls', true);
+pref('zen.view.experimental-no-window-controls', false);
 
 pref('zen.tabs.dim-pending', true);
 pref('zen.tabs.newtab-on-middle-click', true);
diff --git a/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs-topbar.inc.css b/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs-topbar.inc.css
index 1d1c6fc64..2d5f1485d 100644
--- a/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs-topbar.inc.css
+++ b/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs-topbar.inc.css
@@ -2,7 +2,7 @@ height: var(--zen-toolbar-height);
 
 @media (-moz-bool-pref: 'zen.view.hide-window-controls') {
   & {
-    transition: height 0.2s ease, opacity 0.2s ease-out;
+    transition: height 0.15s ease, opacity 0.1s ease-out;
     transition-delay: 0.2s;
 
     & > * {
@@ -21,6 +21,15 @@ height: var(--zen-toolbar-height);
       pointer-events: none;
     }
   }
+
+  @media (-moz-bool-pref: 'zen.view.experimental-no-window-controls') {
+    &:has(#PersonalToolbar[collapsed='true']) {
+      max-height: 0 !important;
+      overflow: hidden;
+      opacity: 0 !important;
+      pointer-events: none !important;
+    }
+  }
 }
 
 :root[inDOMFullscreen='true'] & {
diff --git a/src/browser/base/zen-components/ZenCompactMode.mjs b/src/browser/base/zen-components/ZenCompactMode.mjs
index 4c8d06952..6d95153ac 100644
--- a/src/browser/base/zen-components/ZenCompactMode.mjs
+++ b/src/browser/base/zen-components/ZenCompactMode.mjs
@@ -67,6 +67,8 @@ var gZenCompactModeManager = {
   },
 
   updateCompactModeContext(isSingleToolbar) {
+    this.getAndApplySidebarWidth(); // Ignore return value
+
     const IDs = ['zen-context-menu-compact-mode-hide-sidebar', 'zen-context-menu-compact-mode-hide-toolbar', 'zen-context-menu-compact-mode-hide-both'];
     for (let id of IDs) {
       document.getElementById(id).disabled = isSingleToolbar;
@@ -99,6 +101,12 @@ var gZenCompactModeManager = {
     this.animateCompactMode();
   },
 
+  getAndApplySidebarWidth() {
+    let sidebarWidth = this.sidebar.getBoundingClientRect().width;
+    this.sidebar.style.setProperty("--zen-sidebar-width", `${sidebarWidth}px`);
+    return sidebarWidth;
+  },
+
   animateCompactMode() {
     const isCompactMode = this.prefefence;
     const canHideSidebar = Services.prefs.getBoolPref('zen.view.compact.hide-tabbar');
@@ -109,8 +117,7 @@ var gZenCompactModeManager = {
     // Do this so we can get the correct width ONCE compact mode styled have been applied
     this.sidebar.setAttribute("animate", "true");
     window.requestAnimationFrame(() => {
-      let sidebarWidth = this.sidebar.getBoundingClientRect().width;
-      this.sidebar.style.setProperty("--zen-sidebar-width", `${sidebarWidth}px`);
+      let sidebarWidth = this.getAndApplySidebarWidth();
       if (!this._canAnimateSidebar) {
         this.sidebar.removeAttribute("animate");
         this._isAnimating = false;