Merge branch 'dev' into formatting

Signed-off-by: mr. m  <[email protected]>

.github/workflows/build.yml

@@ -664,10 +664,10 @@ jobs:
           git-token: ${{ secrets.DEPLOY_KEY }}
           delete-branch: true
 
-  release-homebrew:
+  release-homebrew-alpha:
     if: ${{ inputs.create_release && inputs.update_branch == 'alpha' }}
     permissions: write-all
-    name: Homebrew release
+    name: Homebrew release for alpha build
     needs: [release, mac, build-data]
     runs-on: macos-latest
 
@@ -683,8 +683,33 @@ jobs:
         with:
           username: zen-browser-auto
 
-      - name: Bump zen-browser
+      - name: Bump cask
         uses: Homebrew/actions/bump-packages@master
         with:
           token: ${{ secrets.DEPLOY_KEY }}
           casks: zen-browser
+
+  release-homebrew-twilight:
+    if: ${{ inputs.create_release && inputs.update_branch == 'twilight' }}
+    permissions: write-all
+    name: Homebrew release for twilight build
+    needs: [release, mac, build-data]
+    runs-on: macos-latest
+
+    steps:
+      - name: Set up Homebrew
+        uses: Homebrew/actions/setup-homebrew@master
+        with:
+          cask: true
+          test-bot: false
+
+      - name: Setup git
+        uses: Homebrew/actions/git-user-config@master
+        with:
+          username: zen-browser-auto
+
+      - name: Bump cask
+        uses: Homebrew/actions/bump-packages@master
+        with:
+          token: ${{ secrets.DEPLOY_KEY }}
+          casks: zen-browser@twilight

package.json

@@ -33,7 +33,7 @@
   },
   "homepage": "https://github.com/zen-browser/core#readme",
   "dependencies": {
-    "@zen-browser/surfer": "^1.6.3"
+    "@zen-browser/surfer": "^1.6.4"
   },
   "devDependencies": {
     "husky": "^9.1.5",

src/browser/app/profile/zen-browser.js

@@ -76,7 +76,7 @@ pref('zen.welcomeScreen.seen', false);
 
 pref('zen.tabs.vertical', true);
 pref('zen.tabs.vertical.right-side', false);
-pref('zen.theme.accent-color', "#aac7ff");
+pref('zen.theme.accent-color', "#ffb787");
 pref('zen.theme.content-element-separation', 6); // In pixels
 pref('zen.theme.pill-button', false);
 pref('zen.theme.gradient', true);
@@ -111,17 +111,15 @@ pref('zen.view.compact.color-sidebar', true);
 pref('zen.glance.enabled', true);
 pref('zen.glance.hold-duration', 300); // in ms
 
-#ifdef XP_MACOSX
 pref('zen.glance.activation-method', 'alt'); // ctrl, alt, shift, none, hold
-#else
-pref('zen.glance.activation-method', 'ctrl'); // ctrl, alt, shift, none, hold
-#endif
 
 pref('zen.view.sidebar-height-throttle', 200); // in ms
 pref('zen.view.sidebar-expanded.max-width', 400);
 
 pref('zen.view.show-bottom-border', false);
-pref('zen.view.use-single-toolbar', false, locked);
+pref('zen.view.use-single-toolbar', true);
+pref('zen.view.sidebar-expanded', true);
+pref('zen.view.sidebar-collapsed.hide-mute-button', true);
 
 #ifndef XP_MACOSX
 pref('zen.view.hide-window-controls', true);

src/browser/base/content/ZenCustomizableUI.sys.mjs

@@ -45,7 +45,7 @@ export var ZenCustomizableUI = new (class {
         customizationtarget="zen-sidebar-top-buttons-customization-target"
         mode="icons">
         <hbox id="zen-sidebar-top-buttons-customization-target" class="customization-target" flex="1">
-          <toolbarbutton hidden="true" removable="true" class="chromeclass-toolbar-additional toolbarbutton-1 zen-sidebar-action-button" id="zen-expand-sidebar-button" data-l10n-id="sidebar-zen-expand" cui-areatype="toolbar" oncommand="gZenVerticalTabsManager.toggleExpand();"></toolbarbutton>
+          <toolbarbutton removable="true" class="chromeclass-toolbar-additional toolbarbutton-1 zen-sidebar-action-button" id="zen-expand-sidebar-button" data-l10n-id="sidebar-zen-expand" cui-areatype="toolbar" oncommand="gZenVerticalTabsManager.toggleExpand();"></toolbarbutton>
           <toolbarbutton removable="true" class="toolbarbutton-1 zen-sidebar-action-button zen-compact-mode-ignore" id="zen-sidepanel-button" data-l10n-id="sidebar-zen-sidepanel" onclick="gZenBrowserManagerSidebar.toggle();"></toolbarbutton>
         </hbox>
       </toolbar>

src/browser/base/content/ZenUIManager.mjs

@@ -126,6 +126,7 @@ var gZenVerticalTabsManager = {
     Services.prefs.addObserver('zen.tabs.vertical.right-side', updateEvent);
     Services.prefs.addObserver('zen.view.sidebar-expanded.max-width', updateEvent);
     Services.prefs.addObserver('zen.view.use-single-toolbar', updateEvent);
+    Services.prefs.addObserver('zen.view.sidebar-expanded', updateEvent);
 
     this._toolbarOriginalParent = document.getElementById('nav-bar').parentElement;
 
@@ -154,6 +155,11 @@ var gZenVerticalTabsManager = {
     }
   },
 
+  toggleExpand() {
+    const newVal = !Services.prefs.getBoolPref('zen.view.sidebar-expanded');
+    Services.prefs.setBoolPref('zen.view.sidebar-expanded', newVal);
+  },
+
   get navigatorToolbox() {
     if (this._navigatorToolbox) {
       return this._navigatorToolbox;
@@ -202,22 +208,29 @@ var gZenVerticalTabsManager = {
     const topButtons = document.getElementById('zen-sidebar-top-buttons');
     const isCompactMode = Services.prefs.getBoolPref('zen.view.compact');
     const isVerticalTabs = Services.prefs.getBoolPref('zen.tabs.vertical');
+    const isSidebarExpanded = Services.prefs.getBoolPref('zen.view.sidebar-expanded') || !isVerticalTabs;
     const isRightSide = Services.prefs.getBoolPref('zen.tabs.vertical.right-side') && isVerticalTabs;
-    const isSingleToolbar = Services.prefs.getBoolPref('zen.view.use-single-toolbar') && isVerticalTabs;
+    const isSingleToolbar = Services.prefs.getBoolPref('zen.view.use-single-toolbar') && (isVerticalTabs && isSidebarExpanded) || !isVerticalTabs;
     const titlebar = document.getElementById('titlebar');
 
     gBrowser.tabContainer.setAttribute('orient', isVerticalTabs ? 'vertical' : 'horizontal');
     gBrowser.tabContainer.arrowScrollbox.setAttribute('orient', isVerticalTabs ? 'vertical' : 'horizontal');
 
     const buttonsTarget = document.getElementById('zen-sidebar-top-buttons-customization-target');
-    if (isRightSide && isVerticalTabs) {
+    if (isRightSide) {
       this.navigatorToolbox.setAttribute('zen-right-side', 'true');
       document.documentElement.setAttribute('zen-right-side', 'true');
     } else {
       this.navigatorToolbox.removeAttribute('zen-right-side');
       document.documentElement.removeAttribute('zen-right-side');
     }
 
+    if (isSidebarExpanded) {
+      this.navigatorToolbox.setAttribute('zen-sidebar-expanded', 'true');
+    } else {
+      this.navigatorToolbox.removeAttribute('zen-sidebar-expanded');
+    }
+
     const appContentNavbarContaienr = document.getElementById('zen-appcontent-navbar-container');
     if ((!isRightSide && this.isWindowsStyledButtons) || (isRightSide && !this.isWindowsStyledButtons) || isCompactMode) {
       appContentNavbarContaienr.setAttribute('should-hide', 'true');
@@ -237,9 +250,9 @@ var gZenVerticalTabsManager = {
     //  tabboxWrapper.prepend(this.navigatorToolbox);
     }
 
-    if (!isVerticalTabs) {
-      document.getElementById("urlbar-container").after(document.getElementById('navigator-toolbox'));
-    }
+    //if (!isVerticalTabs) {
+    //  document.getElementById("urlbar-container").after(document.getElementById('navigator-toolbox'));
+    //}
 
     let windowButtons = this.actualWindowButtons;
     let doNotChangeWindowButtons = !isCompactMode && isRightSide && this.isWindowsStyledButtons;

src/browser/base/content/navigator-toolbox-inc-xhtml.patch

@@ -1,5 +1,5 @@
 diff --git a/browser/base/content/navigator-toolbox.inc.xhtml b/browser/base/content/navigator-toolbox.inc.xhtml
-index eb2d8670874bd5bcaf9253caafb98444cb8cfcd9..eba11edbbcebe8201a6e1153d66a5b63ab62acc7 100644
+index eb2d8670874bd5bcaf9253caafb98444cb8cfcd9..51e6c01c279e0105ec8ac08df0763027179c0616 100644
 --- a/browser/base/content/navigator-toolbox.inc.xhtml
 +++ b/browser/base/content/navigator-toolbox.inc.xhtml
 @@ -2,7 +2,7 @@
@@ -29,7 +29,15 @@ index eb2d8670874bd5bcaf9253caafb98444cb8cfcd9..eba11edbbcebe8201a6e1153d66a5b63
        <toolbartabstop/>
        <hbox id="TabsToolbar-customization-target" flex="1">
          <toolbarbutton id="firefox-view-button"
-@@ -55,9 +55,14 @@
+@@ -40,6 +40,7 @@
+                        data-l10n-id="toolbar-button-firefox-view-2"
+                        role="button"
+                        aria-pressed="false"
++                       hidden="true"
+                        cui-areatype="toolbar"
+                        removable="true"/>
+
+@@ -55,9 +56,14 @@
  # significantly, there is an optimization in
  # DisplayPortUtils::MaybeCreateDisplayPortInFirstScrollFrameEncountered based
  # the current structure that we may want to revisit.
@@ -45,7 +53,7 @@ index eb2d8670874bd5bcaf9253caafb98444cb8cfcd9..eba11edbbcebe8201a6e1153d66a5b63
              <tab is="tabbrowser-tab" class="tabbrowser-tab" selected="true" visuallyselected="" fadein=""/>
              <hbox id="tabbrowser-arrowscrollbox-periphery">
                <toolbartabstop/>
-@@ -100,11 +105,12 @@
+@@ -100,11 +106,12 @@
  #include private-browsing-indicator.inc.xhtml
      <toolbarbutton id="content-analysis-indicator"
                     class="toolbarbutton-1 content-analysis-indicator-icon"/>
@@ -61,7 +69,7 @@ index eb2d8670874bd5bcaf9253caafb98444cb8cfcd9..eba11edbbcebe8201a6e1153d66a5b63
    <toolbar id="nav-bar"
             class="browser-toolbar chromeclass-location"
             data-l10n-id="navbar-accessible"
-@@ -487,10 +493,12 @@
+@@ -487,10 +494,12 @@
                       consumeanchor="PanelUI-button"
                       data-l10n-id="appmenu-menu-button-closed2"/>
      </toolbaritem>

src/browser/base/content/zen-styles/zen-animations.css

@@ -56,7 +56,18 @@
 
 @keyframes zen-slide-in {
   from {
-    transform: translateX(-30px);
+    transform: translateX(-100%);
+    opacity: 0;
+  }
+  to {
+    transform: translateX(0);
+    opacity: 1;
+  }
+}
+
+@keyframes zen-slide-in-reverse {
+  from {
+    transform: translateX(100%);
     opacity: 0;
   }
   to {
@@ -228,9 +239,9 @@
     height: 0%;
   }
 
-  70% {
+  80% {
     /* make the box grow to full width/height */
-    opacity: .5;
+    opacity: 1;
     transform: translate(-50%, -50%) translateZ(0);
     top: 50%;
     left: 50%;
@@ -253,31 +264,22 @@
   0% {
     /* make the box shrink to final width/height and x/y coordinates */
     transform: translate(-50%, -50%) translateZ(0);
-    opacity: 1;
     width: 85%;
     height: 100%;
     top: 50%;
     left: 50%;
-  }
-
-  50% {
-    /* make the box grow to full width/height */
     opacity: 1;
-    transform: translate(-50%, -50%) translateZ(0);
-    top: 50%;
-    left: 50%;
-    width: 87%;
-    height: 102%;
   }
 
   100% {
     /* make the box appear from initial width/height and x/y coordinates */
+    transform: translate(-50%, -50%) translateZ(0);
     opacity: 0;
+    width: 47%;
+    height: 53%;
     top: 50%;
     left: 50%;
-    transform: translate(-50%, -50%) translateZ(0);
-    width: 0%;
-    height: 0%;
+    opacity: 0;
   }
 }
 
@@ -293,10 +295,10 @@
   to {
     width: 100%;
     height: 100%;
-    top: 0;
-    left: 0;
+    top: 50%;
+    left: 50%;
     opacity: 1;
-    transform: none;
+    transform: translate(-50%, -50%); 
   }
 }
 

src/browser/base/content/zen-styles/zen-browser-container.css

@@ -4,8 +4,10 @@
     border-radius: var(--zen-webview-border-radius, var(--zen-border-radius));
     position: relative;
 
+    /* For glance */
+    transition: transform 0.1s ease-in-out, opacity 0.1s ease-in-out;
+
     box-shadow: 0 0 1px 1px light-dark(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5));
-    border-radius: var(--zen-border-radius);
     overflow: hidden;
     margin: 1px;
 

src/browser/base/content/zen-styles/zen-browser-ui.css

@@ -75,6 +75,7 @@
 #zen-appcontent-wrapper {
   max-width: 100%;
   overflow-x: hidden;
+  z-index: 1;
 }
 
 :root:not([inDOMFullscreen='true']):not([chromehidden~='location']):not([chromehidden~='toolbar']) {

src/browser/base/content/zen-styles/zen-glance.css

@@ -5,7 +5,6 @@
 }
 
 .zen-glance-background {
-  transition: transform 0.1s ease-in-out, opacity 0.1s ease-in-out;
   transform: scale(0.98);
   backdrop-filter: blur(5px);
   opacity: 0.6;
@@ -28,7 +27,7 @@
 
     & .browserContainer {
       opacity: 1;
-      animation: zen-glance-content-animation-out .5s ease-in-out forwards !important;
+      animation: zen-glance-content-animation-out .3s ease-in-out forwards !important;
 
       & browser {
         opacity: 1 !important;