Merge branch 'dev' of https://github.com/zen-browser/desktop into dev

src/browser/themes/shared/urlbar-searchbar-css.patch

@@ -1,5 +1,5 @@
 diff --git a/browser/themes/shared/urlbar-searchbar.css b/browser/themes/shared/urlbar-searchbar.css
-index e237ee9edea85c1d2ef22f988df6b22755e343e6..b06fc06686a7a969e924ad0df662dec937b3c70d 100644
+index e237ee9edea85c1d2ef22f988df6b22755e343e6..abee0dc035833c4334e55bd8cd7483bbcc71f97f 100644
 --- a/browser/themes/shared/urlbar-searchbar.css
 +++ b/browser/themes/shared/urlbar-searchbar.css
 @@ -5,7 +5,7 @@
@@ -11,14 +11,18 @@ index e237ee9edea85c1d2ef22f988df6b22755e343e6..b06fc06686a7a969e924ad0df662dec9
    --urlbar-margin-inline: 5px;
    --urlbar-padding-block: 4px;
  }
-@@ -292,7 +292,9 @@
+@@ -292,10 +292,14 @@
  }
  
  #urlbar[breakout][breakout-extend] {
--  margin-left: calc(-1 * var(--urlbar-margin-inline));
 +  :root:not([zen-single-toolbar='true']) {
-+    margin-left: calc(-1 * var(--urlbar-margin-inline));
+   margin-left: calc(-1 * var(--urlbar-margin-inline));
 +  }
++  align-items: center;
    width: calc(var(--urlbar-width) + 2 * var(--urlbar-margin-inline));
  
    > .urlbar-input-container {
++    align-items: center;
+     height: var(--urlbar-container-height);
+     padding-block: calc((var(--urlbar-container-height) - var(--urlbar-height)) / 2 + var(--urlbar-container-padding));
+     padding-inline: calc(var(--urlbar-margin-inline) + var(--urlbar-container-padding));

src/zen/common/ZenUIManager.mjs

@@ -769,7 +769,7 @@ var gZenVerticalTabsManager = {
       // on purpose, we set the orient to horizontal, because the arrowScrollbox is vertical
       gBrowser.tabContainer.arrowScrollbox.scrollbox.setAttribute(
         'orient',
-        isVerticalTabs && gZenWorkspaces.workspaceEnabled ? 'horizontal' : 'vertical'
+        isVerticalTabs ? 'vertical' : 'horizontal'
       );
 
       const buttonsTarget = document.getElementById('zen-sidebar-top-buttons-customization-target');

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

@@ -174,7 +174,7 @@
       --zen-urlbar-background-transparent,
       var(--zen-urlbar-background-base)
     ) !important;
-    box-shadow: 0px 0px 90px -10px rgba(0, 0, 0, 0.6);
+    box-shadow: 0px 0px 90px -10px rgba(0, 0, 0, 0.6) !important;
     backdrop-filter: none !important;
     border-radius: 12px !important;
     outline: 0.5px solid light-dark(rgba(0, 0, 0, 0.15), rgba(255, 255, 255, 0.15)) !important;

src/zen/compact-mode/ZenCompactMode.mjs

@@ -271,6 +271,8 @@ var gZenCompactModeManager = {
               // Subtract from the splitter width to end up with the correct element separation
               sidebarWidth += 1.5 * splitterWidth - elementSeparation;
             }
+          } else {
+            sidebarWidth -= elementSeparation;
           }
           gZenUIManager.motion
             .animate(

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

@@ -64,10 +64,14 @@
           top: 0;
           bottom: var(--zen-element-separation);
           padding: 0 var(--zen-compact-float) !important;
-
+          :root[zen-single-toolbar='true'] & {
             top: calc(var(--zen-element-separation) / 2);
             height: calc(100% - var(--zen-element-separation));
-
+          }
+          :root:not([zen-single-toolbar='true']) & {
+            height: calc(100% + var(--zen-element-separation) * 2);
+            top: calc(var(--zen-element-separation) / -2);
+          }
           & #zen-sidebar-top-buttons {
             margin: 0 0 calc(var(--zen-toolbox-padding) / 2) 0;
           }
@@ -345,7 +349,7 @@
         border-top-right-radius: env(-moz-gtk-csd-titlebar-radius);
         transition: all 0.15s ease;
         width: 100%;
-        opacity: 0;
+        visibility: hidden;
         background: var(--zen-dialog-background);
 
         max-height: var(--zen-toolbar-height);
@@ -373,7 +377,7 @@
       & #zen-appcontent-navbar-container:has(
           *:is([panelopen='true'], [open='true'], #urlbar:focus-within, [breakout-extend='true']):not(#urlbar[zen-floating-urlbar='true']):not(.zen-compact-mode-ignore)
         ) {
-        opacity: 1;
+        visibility: visible !important;
         border-top-width: 1px;
 
         top: -1px;

src/zen/tabs/zen-tabs/vertical-tabs-topbuttons-fix.css

@@ -4,7 +4,7 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/.
  */
 
-&
+&:not([zen-compact-animating])
   #zen-sidebar-top-buttons:not(
     :has(#zen-sidebar-top-buttons-customization-target > *:not(#zen-sidebar-top-buttons-separator))
   ) {

src/zen/workspaces/ZenWorkspace.mjs

@@ -86,6 +86,13 @@
         );
       };
 
+      this.scrollbox._canScrollToElement = (element) => {
+        if (gBrowser.isTab(element)) {
+          return !element.hasAttribute('zen-essential') || !this.hasAttribute('positionpinnedtabs');
+        }
+        return true;
+      };
+
       // Override for performance reasons. This is the size of a single element
       // that can be scrolled when using mouse wheel scrolling. If we don't do
       // this then arrowscrollbox computes this value by calling
@@ -95,9 +102,13 @@
       // height. For tab group labels, the number won't exactly match, but
       // that shouldn't be a problem in practice since the arrowscrollbox
       // stops at element bounds when finishing scrolling.
-      Object.defineProperty(this.scrollbox, 'lineScrollAmount', {
-        get: () => 36,
-      });
+      try {
+        Object.defineProperty(this.scrollbox, 'lineScrollAmount', {
+          get: () => 36,
+        });
+      } catch (e) {
+        console.warn('Failed to set lineScrollAmount', e);
+      }
 
       // Add them manually since attribute inheritance doesn't work
       // for multiple layers of shadow DOM.

src/zen/workspaces/ZenWorkspaces.mjs

@@ -808,13 +808,6 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
       this._initializeWorkspaceTabContextMenus();
       await this.workspaceBookmarks();
       window.addEventListener('TabBrowserInserted', this.onTabBrowserInserted.bind(this));
-      const tabUpdateListener = this.updateTabsContainers.bind(this);
-      window.addEventListener('TabOpen', tabUpdateListener);
-      window.addEventListener('TabClose', tabUpdateListener);
-      window.addEventListener('TabAddedToEssentials', tabUpdateListener);
-      window.addEventListener('TabRemovedFromEssentials', tabUpdateListener);
-      window.addEventListener('TabPinned', tabUpdateListener);
-      window.addEventListener('TabUnpinned', tabUpdateListener);
       let activeWorkspace = await this.getActiveWorkspace();
       this.activeWorkspace = activeWorkspace?.uuid;
       try {
@@ -831,6 +824,14 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
       this._fixTabPositions();
       this._resolveInitialized();
       this._clearAnyZombieTabs(); // Dont call with await
+
+      const tabUpdateListener = this.updateTabsContainers.bind(this);
+      window.addEventListener('TabOpen', tabUpdateListener);
+      window.addEventListener('TabClose', tabUpdateListener);
+      window.addEventListener('TabAddedToEssentials', tabUpdateListener);
+      window.addEventListener('TabRemovedFromEssentials', tabUpdateListener);
+      window.addEventListener('TabPinned', tabUpdateListener);
+      window.addEventListener('TabUnpinned', tabUpdateListener);
     }
   }