feat: Make sure to correct system accent color, b=no-bug, c=common, compact-mode, tabs, workspaces

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

@@ -45,7 +45,7 @@
 
   @media not ((-moz-pref('zen.view.experimental-no-window-controls') or (not -moz-pref('zen.view.hide-window-controls'))) and -moz-pref('zen.view.use-single-toolbar')) {
     .browserSidebarContainer:is(.deck-selected, [zen-split='true']) .browserContainer {
-      transition: margin 0.1s ease;
+      transition: margin var(--zen-hidden-toolbar-transition);
 
       :root[zen-single-toolbar='true'] & {
         transition-delay: 0.2s;

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

@@ -192,6 +192,7 @@
 
   /* Transitions */
   --zen-tabbox-element-indent-transition: margin-inline-start 0.1s ease-in-out;
+  --zen-hidden-toolbar-transition: 0.15s ease-in-out;
 
   /* XUL */
   --zen-main-browser-background: light-dark(rgb(235, 235, 235), #1b1b1b);

src/zen/compact-mode/toolbar.inc.css

@@ -15,6 +15,12 @@
     }
   }
 
+  &[zen-right-side='true'][zen-window-buttons-reversed='true'] #titlebar,
+  &:not([zen-right-side='true']):not([zen-window-buttons-reversed='true']) #titlebar {
+    /* The same as the expression above */
+    margin-top: var(--zen-element-separation) !important;
+  }
+
   & #zen-appcontent-wrapper {
     z-index: 3 !important;
   }
@@ -23,28 +29,22 @@
     & .zen-toolbar-background {
       display: flex;
     }
-    transition: height 0.1s ease;
-
+    transition: height var(--zen-hidden-toolbar-transition);
+    
     height: var(--zen-element-separation);
     overflow: clip;
 
     & #urlbar:not([breakout-extend='true']) {
       opacity: 0;
       pointer-events: none;
-      transition: opacity 0.1s ease;
+      transition: opacity var(--zen-hidden-toolbar-transition);
     }
 
-    & .titlebar-buttonbox-container {
-      visibility: hidden;
-      /* We need to hide them since on Windows the native
-       * panels when hovering over them can interfere with the
-       * web content */
-      transition: visibility 0.1s ease;
-    }
+%include windows-captions-fix-default.inc.css
 
     & #zen-appcontent-navbar-container {
       opacity: 0;
-      transition: opacity 0.1s ease;
+      transition: opacity var(--zen-hidden-toolbar-transition);
     }
   }
 
@@ -61,10 +61,7 @@
     height: var(--zen-toolbar-height-with-bookmarks);
     overflow: inherit;
 
-    & .titlebar-buttonbox-container {
-      visibility: visible;
-      transition: none;
-    }
+%include windows-captions-fix-active.inc.css
 
     & #urlbar {
       opacity: 1;
@@ -73,7 +70,6 @@
 
     & #zen-appcontent-navbar-container {
       opacity: 1;
-      transition: none;
     }
   }
 }

src/zen/compact-mode/windows-captions-fix-active.inc.css

@@ -0,0 +1,10 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+& .titlebar-buttonbox-container {
+  visibility: visible;
+  transition: none;
+}

src/zen/compact-mode/windows-captions-fix-default.inc.css

@@ -0,0 +1,13 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+& .titlebar-buttonbox-container {
+  display: collapse;
+  /* We need to hide them since on Windows the native
+   * panels when hovering over them can interfere with the
+   * web content */
+  transition: visibility var(--zen-hidden-toolbar-transition);
+}

src/zen/tabs/zen-tabs/vertical-tabs-topbar.inc.css

@@ -12,11 +12,13 @@ z-index: 1;
 }
 
 @media -moz-pref('zen.view.hide-window-controls') {
-  transition: height 0.1s ease, opacity 0.1s ease;
+  transition: height var(--zen-hidden-toolbar-transition), opacity var(--zen-hidden-toolbar-transition);
   will-change: height, opacity;
   transition-delay: 0.2s;
   overflow: clip;
 
+%include ../../compact-mode/windows-captions-fix-active.inc.css
+
   &:not([zen-has-hover='true']):not([has-popup-menu]):not(:focus-within):not(
       :has(*:is([panelopen='true'], [open='true']))
     ) {
@@ -26,6 +28,8 @@ z-index: 1;
       pointer-events: none;
     }
 
+%include ../../compact-mode/windows-captions-fix-default.inc.css
+
     & .titlebar-button {
       padding-top: 0 !important;
       padding-bottom: 0 !important;

src/zen/workspaces/ZenGradientGenerator.mjs

@@ -1531,6 +1531,13 @@
           'color'
         ];
         rgb = rawRgb.match(/\d+/g).map(Number);
+        // Match our theme a bit more, since we can't always expect the OS
+        // to give us a color matching our theme scheme
+        rgb = this.blendColors(
+          rgb,
+          this.getToolbarModifiedBaseRaw().slice(0, 3),
+          this.isDarkMode ? 80 : 50
+        );
       } else {
         rgb = this.hexToRgb(accentColor);
       }