From cf0662d0a4fb74baf3f40836e09048e09c359418 Mon Sep 17 00:00:00 2001
From: Vrezh Fedora <vrezhraiden@gmail.com>
Date: Thu, 27 Feb 2025 12:09:00 +0100
Subject: [PATCH 01/12] feat(glance): glance buttons fix overflow

---
 src/browser/base/content/zen-glance.inc.xhtml |   8 +-
 .../base/content/zen-styles/zen-glance.css    |  11 +-
 .../base/zen-components/ZenGlanceManager.mjs  | 119 +++++++++++-------
 3 files changed, 87 insertions(+), 51 deletions(-)

diff --git a/src/browser/base/content/zen-glance.inc.xhtml b/src/browser/base/content/zen-glance.inc.xhtml
index 64d5a0703..02a9b0c68 100644
--- a/src/browser/base/content/zen-glance.inc.xhtml
+++ b/src/browser/base/content/zen-glance.inc.xhtml
@@ -1,4 +1,6 @@
-<vbox id="zen-glance-sidebar-container" hidden="true">
-  <toolbarbutton id="zen-glance-sidebar-close" class="toolbarbutton-1" oncommand="gZenGlanceManager.closeGlance({ onTabClose: true })"/>
-  <toolbarbutton id="zen-glance-sidebar-open" class="toolbarbutton-1" oncommand="gZenGlanceManager.fullyOpenGlance()"/>
+<vbox id="glance-wrapper" style="position: relative; overflow: visible;">
+  <vbox id="zen-glance-sidebar-container" hidden="true">
+    <toolbarbutton id="zen-glance-sidebar-close" class="toolbarbutton-1" oncommand="gZenGlanceManager.closeGlance({ onTabClose: true })"/>
+    <toolbarbutton id="zen-glance-sidebar-open" class="toolbarbutton-1" oncommand="gZenGlanceManager.fullyOpenGlance()"/>
+  </vbox>
 </vbox>
diff --git a/src/browser/base/content/zen-styles/zen-glance.css b/src/browser/base/content/zen-styles/zen-glance.css
index 4ea37f5db..7c175e75f 100644
--- a/src/browser/base/content/zen-styles/zen-glance.css
+++ b/src/browser/base/content/zen-styles/zen-glance.css
@@ -9,6 +9,12 @@
   visibility: inherit;
 }
 
+#glance-wrapper {
+  position: relative;
+  overflow: visible;
+  left: 2%;
+}
+
 #zen-glance-sidebar-container {
   position: absolute;
   display: flex;
@@ -23,7 +29,6 @@
 
   padding: 5px;
   gap: 12px;
-  left: 2%;
 
   & toolbarbutton {
     width: 32px;
@@ -49,6 +54,10 @@
   }
 }
 
+#zen-glance-sidebar-container[hidden='true'] {
+  display: none;
+}
+
 .browserSidebarContainer.zen-glance-overlay {
   box-shadow: none !important;
 
diff --git a/src/browser/base/zen-components/ZenGlanceManager.mjs b/src/browser/base/zen-components/ZenGlanceManager.mjs
index 8040dd7c5..a0c963e92 100644
--- a/src/browser/base/zen-components/ZenGlanceManager.mjs
+++ b/src/browser/base/zen-components/ZenGlanceManager.mjs
@@ -11,36 +11,31 @@
       window.addEventListener('TabClose', this.onTabClose.bind(this));
       window.addEventListener('TabSelect', this.onLocationChange.bind(this));
 
+      ChromeUtils.defineLazyGetter(this, 'sidebarButtons', () => document.getElementById('zen-glance-sidebar-container'));
+      document.getElementById('tabbrowser-tabpanels').addEventListener('click', this.onOverlayClick.bind(this));
+      Services.obs.addObserver(this, 'quit-application-requested');
+
       XPCOMUtils.defineLazyPreferenceGetter(
         this._lazyPref,
         'SHOULD_OPEN_EXTERNAL_TABS_IN_GLANCE',
         'zen.glance.open-essential-external-links',
         false
       );
-
-      ChromeUtils.defineLazyGetter(this, 'sidebarButtons', () => document.getElementById('zen-glance-sidebar-container'));
-
-      document.getElementById('tabbrowser-tabpanels').addEventListener('click', this.onOverlayClick.bind(this));
-
-      Services.obs.addObserver(this, 'quit-application-requested');
     }
 
     get #currentBrowser() {
       return this.#glances.get(this.#currentGlanceID)?.browser;
     }
-
     get #currentTab() {
       return this.#glances.get(this.#currentGlanceID)?.tab;
     }
-
     get #currentParentTab() {
       return this.#glances.get(this.#currentGlanceID)?.parentTab;
     }
 
+    // If the user presses Escape while a Glance is open, close it
     onKeyDown(event) {
-      if (event.defaultPrevented) {
-        return;
-      }
+      if (event.defaultPrevented) return;
       if (event.key === 'Escape' && this.#currentGlanceID) {
         event.preventDefault();
         event.stopPropagation();
@@ -49,6 +44,7 @@
     }
 
     onOverlayClick(event) {
+      // If user clicks outside content area, close glance
       if (event.target === this.overlay && event.originalTarget !== this.contentWrapper) {
         this.closeGlance({ onTabClose: true });
       }
@@ -63,16 +59,18 @@
     }
 
     onUnload() {
-      // clear everything
+      // Clean up all open Glances
       for (let [id, glance] of this.#glances) {
         gBrowser.removeTab(glance.tab, { animate: false });
       }
     }
 
+    // Figure out where to insert new tabs
     getTabPosition(tab) {
       return Math.max(gBrowser._numVisiblePinTabs, tab._tPos);
     }
 
+    // Create a new tab for Glance
     createBrowserElement(url, currentTab, existingTab = null) {
       const newTabOptions = {
         userContextId: currentTab.getAttribute('usercontextid') || '',
@@ -82,15 +80,21 @@
         index: this.getTabPosition(currentTab),
       };
       currentTab._selected = true;
+
       const newUUID = gZenUIManager.generateUuidv4();
       const newTab = existingTab ?? gBrowser.addTrustedTab(Services.io.newURI(url).spec, newTabOptions);
+
+      // Example: copy any context ID
       if (currentTab.hasAttribute('zenDefaultUserContextId')) {
         newTab.setAttribute('zenDefaultUserContextId', true);
       }
+
+      // Insert the new tab as a child of the existing tab's content
       currentTab.querySelector('.tab-content').appendChild(newTab);
       newTab.setAttribute('zen-glance-tab', true);
       newTab.setAttribute('glance-id', newUUID);
       currentTab.setAttribute('glance-id', newUUID);
+
       this.#glances.set(newUUID, {
         tab: newTab,
         parentTab: currentTab,
@@ -102,12 +106,14 @@
     }
 
     fillOverlay(browser) {
+      // Save references to the parent containers
       this.overlay = browser.closest('.browserSidebarContainer');
       this.browserWrapper = browser.closest('.browserContainer');
       this.contentWrapper = browser.closest('.browserStack');
     }
 
     showSidebarButtons(animate = false) {
+      // Animate in if hidden
       if (this.sidebarButtons.hasAttribute('hidden') && animate) {
         gZenUIManager.motion.animate(
           this.sidebarButtons.querySelectorAll('toolbarbutton'),
@@ -123,40 +129,57 @@
     }
 
     openGlance(data, existingTab = null, ownerTab = null) {
+      // If a glance is already open, do nothing
       if (this.#currentBrowser) {
         return;
       }
+
+      // If the current parent tab is selected, switch to the glance tab
       if (gBrowser.selectedTab === this.#currentParentTab) {
         gBrowser.selectedTab = this.#currentTab;
         return;
       }
+
       this.animatingOpen = true;
       this._animating = true;
 
+      // Gather initial positions
       const initialX = data.x;
       const initialY = data.y;
       const initialWidth = data.width;
       const initialHeight = data.height;
 
+      // Clean up any leftover states
       this.browserWrapper?.removeAttribute('animate');
       this.browserWrapper?.removeAttribute('animate-end');
       this.browserWrapper?.removeAttribute('animate-full');
       this.browserWrapper?.removeAttribute('has-finished-animation');
       this.overlay?.removeAttribute('post-fade-out');
 
+      // Create the new tab
       const currentTab = ownerTab ?? gBrowser.selectedTab;
-
       const browserElement = this.createBrowserElement(data.url, currentTab, existingTab);
 
+      // Fill references
       this.fillOverlay(browserElement);
 
+      const container = document.getElementById('glance-wrapper');
+      if (container) {
+        container.appendChild(this.sidebarButtons);
+      }
+
+      // Start overlay
       this.overlay.classList.add('zen-glance-overlay');
 
+      // Animate open
       this.browserWrapper.removeAttribute('animate-end');
       window.requestAnimationFrame(() => {
+        // "Quick open" logic
         this.quickOpenGlance({ dontOpenButtons: true });
+        // Show the sidebar buttons
         this.showSidebarButtons(true);
 
+        // Animate the parent container
         gZenUIManager.motion.animate(
           this.#currentParentTab.linkedBrowser.closest('.browserSidebarContainer'),
           {
@@ -170,9 +193,12 @@
             bounce: 0.2,
           }
         );
+
+        // Start the transition
         this.#currentBrowser.setAttribute('animate-glance-open', true);
         this.overlay.removeAttribute('fade-out');
         this.browserWrapper.setAttribute('animate', true);
+
         const top = initialY + initialHeight / 2;
         const left = initialX + initialWidth / 2;
         this.browserWrapper.style.top = `${top}px`;
@@ -180,14 +206,19 @@
         this.browserWrapper.style.width = `${initialWidth}px`;
         this.browserWrapper.style.height = `${initialHeight}px`;
         this.browserWrapper.style.opacity = 0.8;
+
+        // Save original position for closing animation
         this.#glances.get(this.#currentGlanceID).originalPosition = {
           top: this.browserWrapper.style.top,
           left: this.browserWrapper.style.left,
           width: this.browserWrapper.style.width,
           height: this.browserWrapper.style.height,
         };
+
         this.browserWrapper.style.transform = 'translate(-50%, -50%)';
         this.overlay.style.overflow = 'visible';
+
+        // Animate up to final size
         gZenUIManager.motion
           .animate(
             this.browserWrapper,
@@ -231,24 +262,26 @@
       this.closingGlance = true;
       this._animating = true;
 
+      // Insert tab at correct index
       gBrowser._insertTabAtIndex(this.#currentTab, {
         index: this.getTabPosition(this.#currentParentTab),
       });
 
-      let quikcCloseZen = false;
       if (onTabClose) {
-        // Create new tab if no more ex
+        // If there's only one tab left, open a new one
         if (gBrowser.tabs.length === 1) {
           BrowserCommands.openTab();
           return;
         }
       }
 
-      // do NOT touch here, I don't know what it does, but it works...
+      // do NOT touch here, unknown but functional
       this.#currentTab.style.display = 'none';
       this.overlay.setAttribute('fade-out', true);
       this.overlay.style.pointerEvents = 'none';
       this.quickCloseGlance({ justAnimateParent: true, clearID: false });
+
+      // Animate the parent container
       const originalPosition = this.#glances.get(this.#currentGlanceID).originalPosition;
       gZenUIManager.motion
         .animate(
@@ -267,6 +300,8 @@
         .then(() => {
           this.#currentParentTab.linkedBrowser.closest('.browserSidebarContainer').removeAttribute('style');
         });
+
+      // Animate the browser wrapper back
       gZenUIManager.motion
         .animate(
           this.browserWrapper,
@@ -283,9 +318,8 @@
             return;
           }
 
-          if (!onTabClose || quikcCloseZen) {
-            this.quickCloseGlance({ clearID: false });
-          }
+          // Final close
+          this.quickCloseGlance({ clearID: false });
           this.overlay.removeAttribute('fade-out');
           this.browserWrapper.removeAttribute('animate');
 
@@ -298,7 +332,7 @@
             this.#currentParentTab._visuallySelected = false;
           }
 
-          // reset everything
+          // Reset everything
           const prevOverlay = this.overlay;
           this.browserWrapper = null;
           this.overlay = null;
@@ -325,6 +359,10 @@
           this._animating = false;
           this.closingGlance = false;
 
+          // Hide the buttons globally whenever we close
+          this.hideSidebarButtons();
+
+          // If we had another Glance queued, open it
           if (this.#currentGlanceID) {
             this.quickOpenGlance();
           }
@@ -344,6 +382,7 @@
       parentBrowserContainer.classList.add('zen-glance-background');
       parentBrowserContainer.classList.remove('zen-glance-overlay');
       parentBrowserContainer.classList.add('deck-selected');
+
       this.#currentParentTab.linkedBrowser.zenModeActive = true;
       this.#currentParentTab.linkedBrowser.docShellIsActive = true;
       this.#currentBrowser.zenModeActive = true;
@@ -360,7 +399,6 @@
 
     quickCloseGlance({ closeCurrentTab = true, closeParentTab = true, justAnimateParent = false, clearID = true } = {}) {
       const parentHasBrowser = !!this.#currentParentTab.linkedBrowser;
-      this.hideSidebarButtons();
       if (parentHasBrowser) {
         this.#currentParentTab.linkedBrowser.closest('.browserSidebarContainer').classList.remove('zen-glance-background');
       }
@@ -397,7 +435,7 @@
       }
     }
 
-    // note: must be async to avoid timing issues
+    // If location changes to a tab with a different glance-id, close the old one
     onLocationChange(event) {
       const tab = event.target;
       if (this.animatingFullOpen || this.closingGlance) {
@@ -440,7 +478,6 @@
           return false;
         }
         this.closeGlance({ onTabClose: true, setNewID: isDifferent ? oldGlanceID : null, isDifferent });
-        // only keep continueing tab close if we are not on the currently selected tab
         return !isDifferent;
       }
       return false;
@@ -448,13 +485,9 @@
 
     tabDomainsDiffer(tab1, url2) {
       try {
-        if (!tab1) {
-          return true;
-        }
+        if (!tab1) return true;
         let url1 = tab1.linkedBrowser.currentURI.spec;
-        if (url1.startsWith('about:')) {
-          return true;
-        }
+        if (url1.startsWith('about:')) return true;
         return Services.io.newURI(url1).host !== url2.host;
       } catch (e) {
         return true;
@@ -476,9 +509,7 @@
 
     onTabOpen(browser, uri) {
       let tab = gBrowser.getTabForBrowser(browser);
-      if (!tab) {
-        return;
-      }
+      if (!tab) return;
       try {
         if (this.shouldOpenTabInGlance(tab, uri)) {
           const browserRect = gBrowser.tabbox.getBoundingClientRect();
@@ -512,9 +543,11 @@
       this.#currentTab.removeAttribute('glance-id');
       this.#currentParentTab.removeAttribute('glance-id');
       gBrowser.selectedTab = this.#currentTab;
+
       this.#currentParentTab.linkedBrowser.closest('.browserSidebarContainer').classList.remove('zen-glance-background');
       this.#currentParentTab._visuallySelected = false;
       this.hideSidebarButtons();
+
       if (gReduceMotion) {
         this.finishOpeningGlance();
         return;
@@ -535,18 +568,11 @@
 
     openGlanceForBookmark(event) {
       const activationMethod = Services.prefs.getStringPref('zen.glance.activation-method', 'ctrl');
-
-      if (activationMethod === 'ctrl' && !event.ctrlKey) {
-        return;
-      } else if (activationMethod === 'alt' && !event.altKey) {
-        return;
-      } else if (activationMethod === 'shift' && !event.shiftKey) {
-        return;
-      } else if (activationMethod === 'meta' && !event.metaKey) {
-        return;
-      } else if (activationMethod === 'mantain' || typeof activationMethod === 'undefined') {
-        return;
-      }
+      if (activationMethod === 'ctrl' && !event.ctrlKey) return;
+      if (activationMethod === 'alt' && !event.altKey) return;
+      if (activationMethod === 'shift' && !event.shiftKey) return;
+      if (activationMethod === 'meta' && !event.metaKey) return;
+      if (activationMethod === 'mantain' || typeof activationMethod === 'undefined') return;
 
       event.preventDefault();
       event.stopPropagation();
@@ -559,9 +585,7 @@
         width: rect.width,
         height: rect.height,
       };
-
       this.openGlance(data);
-
       return false;
     }
 
@@ -570,8 +594,10 @@
     }
   }
 
+  // Expose globally
   window.gZenGlanceManager = new ZenGlanceManager();
 
+  // Register window actors if needed
   function registerWindowActors() {
     if (Services.prefs.getBoolPref('zen.glance.enabled', true)) {
       gZenActorsManager.addJSWindowActor('ZenGlance', {
@@ -588,6 +614,5 @@
       });
     }
   }
-
   registerWindowActors();
 }

From 7f6c5f7211325b6762ebd555ff46698db8dcaac3 Mon Sep 17 00:00:00 2001
From: Vrezh Fedora <vrezhraiden@gmail.com>
Date: Sat, 1 Mar 2025 22:23:49 +0100
Subject: [PATCH 02/12] revert some changes

---
 src/browser/base/zen-components/ZenGlanceManager.mjs | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/browser/base/zen-components/ZenGlanceManager.mjs b/src/browser/base/zen-components/ZenGlanceManager.mjs
index a0c963e92..4b9cdb50b 100644
--- a/src/browser/base/zen-components/ZenGlanceManager.mjs
+++ b/src/browser/base/zen-components/ZenGlanceManager.mjs
@@ -319,7 +319,10 @@
           }
 
           // Final close
-          this.quickCloseGlance({ clearID: false });
+          if (!onTabClose || quikcCloseZen) {
+            this.quickCloseGlance({ clearID: false });
+          }
+
           this.overlay.removeAttribute('fade-out');
           this.browserWrapper.removeAttribute('animate');
 
@@ -359,9 +362,6 @@
           this._animating = false;
           this.closingGlance = false;
 
-          // Hide the buttons globally whenever we close
-          this.hideSidebarButtons();
-
           // If we had another Glance queued, open it
           if (this.#currentGlanceID) {
             this.quickOpenGlance();
@@ -399,6 +399,7 @@
 
     quickCloseGlance({ closeCurrentTab = true, closeParentTab = true, justAnimateParent = false, clearID = true } = {}) {
       const parentHasBrowser = !!this.#currentParentTab.linkedBrowser;
+      this.hideSidebarButtons();
       if (parentHasBrowser) {
         this.#currentParentTab.linkedBrowser.closest('.browserSidebarContainer').classList.remove('zen-glance-background');
       }

From c17779b6d4b815dd6b271a9b62966b4b92b4c4ac Mon Sep 17 00:00:00 2001
From: Vrezh Fedora <vrezhraiden@gmail.com>
Date: Sat, 1 Mar 2025 22:26:46 +0100
Subject: [PATCH 03/12] revert(var): bring back quikcCloseZen

---
 src/browser/base/zen-components/ZenGlanceManager.mjs | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/browser/base/zen-components/ZenGlanceManager.mjs b/src/browser/base/zen-components/ZenGlanceManager.mjs
index 4b9cdb50b..c10f68095 100644
--- a/src/browser/base/zen-components/ZenGlanceManager.mjs
+++ b/src/browser/base/zen-components/ZenGlanceManager.mjs
@@ -267,6 +267,7 @@
         index: this.getTabPosition(this.#currentParentTab),
       });
 
+      let quikcCloseZen = false;
       if (onTabClose) {
         // If there's only one tab left, open a new one
         if (gBrowser.tabs.length === 1) {

From 02a860ba19c6bc05202a0b01e90d313b1e95bcd4 Mon Sep 17 00:00:00 2001
From: Vrezh Fedora <vrezhraiden@gmail.com>
Date: Fri, 14 Mar 2025 22:16:55 +0900
Subject: [PATCH 04/12] Remove inline styles from glance-wrapper element

---
 src/browser/base/content/zen-glance.inc.xhtml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/browser/base/content/zen-glance.inc.xhtml b/src/browser/base/content/zen-glance.inc.xhtml
index 02a9b0c68..bddab1b14 100644
--- a/src/browser/base/content/zen-glance.inc.xhtml
+++ b/src/browser/base/content/zen-glance.inc.xhtml
@@ -1,4 +1,4 @@
-<vbox id="glance-wrapper" style="position: relative; overflow: visible;">
+<vbox id="glance-wrapper">
   <vbox id="zen-glance-sidebar-container" hidden="true">
     <toolbarbutton id="zen-glance-sidebar-close" class="toolbarbutton-1" oncommand="gZenGlanceManager.closeGlance({ onTabClose: true })"/>
     <toolbarbutton id="zen-glance-sidebar-open" class="toolbarbutton-1" oncommand="gZenGlanceManager.fullyOpenGlance()"/>

From 4ec493950c614dd9bc938c8ff4722b6dbe978767 Mon Sep 17 00:00:00 2001
From: Slowlife01 <slowlife1165@gmail.com>
Date: Fri, 21 Mar 2025 18:03:39 +0700
Subject: [PATCH 05/12] MediaController: account for playbackRate

---
 src/browser/base/zen-components/ZenMediaController.mjs | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/browser/base/zen-components/ZenMediaController.mjs b/src/browser/base/zen-components/ZenMediaController.mjs
index cc10e5707..067451a36 100644
--- a/src/browser/base/zen-components/ZenMediaController.mjs
+++ b/src/browser/base/zen-components/ZenMediaController.mjs
@@ -221,6 +221,8 @@ class ZenMediaController {
 
     this._currentPosition = positionState.position;
     this._currentDuration = positionState.duration;
+    this._currentPlaybackRate = positionState.playbackRate;
+
     this.updateMediaPosition();
 
     for (const key of this.supportedKeys) {
@@ -297,6 +299,8 @@ class ZenMediaController {
 
     this._currentPosition = event.position;
     this._currentDuration = event.duration;
+    this._currentPlaybackRate = event.playbackRate;
+
     this.updateMediaPosition();
   }
 
@@ -357,7 +361,7 @@ class ZenMediaController {
 
     this._mediaUpdateInterval = setInterval(() => {
       if (this._currentMediaController?.isPlaying) {
-        this._currentPosition += 1;
+        this._currentPosition += 1 * this._currentPlaybackRate;
         if (this._currentPosition > this._currentDuration) {
           this._currentPosition = this._currentDuration;
         }

From 491234b310e12dba9e6b3a98ec639777c425565f Mon Sep 17 00:00:00 2001
From: "mr. m" <mr.m@tuta.com>
Date: Fri, 21 Mar 2025 12:50:43 +0100
Subject: [PATCH 06/12] fix(styles): update z-index for sidebar splitter and
 remove min-width from workspace button

---
 src/browser/base/content/zen-styles/zen-sidebar-panels.css | 2 +-
 src/browser/base/content/zen-styles/zen-workspaces.css     | 1 -
 2 files changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/browser/base/content/zen-styles/zen-sidebar-panels.css b/src/browser/base/content/zen-styles/zen-sidebar-panels.css
index da116f8df..3bdb4ebdf 100644
--- a/src/browser/base/content/zen-styles/zen-sidebar-panels.css
+++ b/src/browser/base/content/zen-styles/zen-sidebar-panels.css
@@ -111,7 +111,7 @@
   background: transparent;
   border: none;
   cursor: ew-resize;
-  z-index: 2;
+  z-index: 3;
 
   &:is(.zen-split-view-splitter[orient='vertical']) {
     /* Bit of a hacky solution, but it works */
diff --git a/src/browser/base/content/zen-styles/zen-workspaces.css b/src/browser/base/content/zen-styles/zen-workspaces.css
index 497f52cdf..ab55b1a59 100644
--- a/src/browser/base/content/zen-styles/zen-workspaces.css
+++ b/src/browser/base/content/zen-styles/zen-workspaces.css
@@ -72,7 +72,6 @@
     &:has(toolbarbutton:hover) toolbarbutton[active='true'] {
       &:not(:hover) {
         width: min(var(--zen-overflowed-workspace-button-width), 25px);
-        min-width: 10px;
 
         &::after {
           content: '';

From c3d09c486c6ae1f2c1d20dce1f611b13066ed01a Mon Sep 17 00:00:00 2001
From: Slowlife01 <slowlife1165@gmail.com>
Date: Sat, 22 Mar 2025 08:46:40 +0700
Subject: [PATCH 07/12] fix: import string to pip window

---
 .../pictureinpicture/content/player-xhtml.patch      | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/toolkit/components/pictureinpicture/content/player-xhtml.patch b/src/toolkit/components/pictureinpicture/content/player-xhtml.patch
index 92d9b9543..6c0086210 100644
--- a/src/toolkit/components/pictureinpicture/content/player-xhtml.patch
+++ b/src/toolkit/components/pictureinpicture/content/player-xhtml.patch
@@ -1,8 +1,16 @@
 diff --git a/toolkit/components/pictureinpicture/content/player.xhtml b/toolkit/components/pictureinpicture/content/player.xhtml
-index 440ce51e8e67e4d3a7bdcb78f38f2fb6684c9848..6b48a3178f9de460dd3b08728f5638ef2751de21 100644
+index 440ce51e8e67e4d3a7bdcb78f38f2fb6684c9848..3db687ff753c47faf2dac63183f025c5ff456250 100644
 --- a/toolkit/components/pictureinpicture/content/player.xhtml
 +++ b/toolkit/components/pictureinpicture/content/player.xhtml
-@@ -52,13 +52,22 @@
+@@ -14,6 +14,7 @@
+     <meta charset="utf-8"/>
+     <link rel="stylesheet" href="chrome://global/skin/pictureinpicture/player.css"/>
+     <link rel="localization" href="toolkit/pictureinpicture/pictureinpicture.ftl"/>
++    <link rel="localization" href="browser/zen-general.ftl"/>
+     <link rel="localization" href="browser/browserSets.ftl"/>
+     <script src="chrome://global/content/pictureinpicture/player.js"></script>
+     <title data-l10n-id="pictureinpicture-player-title"></title>
+@@ -52,13 +53,22 @@
        tabindex="10"
  #endif
        />

From c2f2a589ed1591009f7e8b30352f2de11d23d5a3 Mon Sep 17 00:00:00 2001
From: Slowlife01 <slowlife1165@gmail.com>
Date: Sat, 22 Mar 2025 08:52:39 +0700
Subject: [PATCH 08/12] shorter export

---
 .../pictureinpicture/content/player-xhtml.patch      | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/toolkit/components/pictureinpicture/content/player-xhtml.patch b/src/toolkit/components/pictureinpicture/content/player-xhtml.patch
index 6c0086210..ff25ccce3 100644
--- a/src/toolkit/components/pictureinpicture/content/player-xhtml.patch
+++ b/src/toolkit/components/pictureinpicture/content/player-xhtml.patch
@@ -1,15 +1,15 @@
 diff --git a/toolkit/components/pictureinpicture/content/player.xhtml b/toolkit/components/pictureinpicture/content/player.xhtml
-index 440ce51e8e67e4d3a7bdcb78f38f2fb6684c9848..3db687ff753c47faf2dac63183f025c5ff456250 100644
+index 440ce51e8e67e4d3a7bdcb78f38f2fb6684c9848..38912579310314a13d516328ec770db6b589d243 100644
 --- a/toolkit/components/pictureinpicture/content/player.xhtml
 +++ b/toolkit/components/pictureinpicture/content/player.xhtml
-@@ -14,6 +14,7 @@
-     <meta charset="utf-8"/>
-     <link rel="stylesheet" href="chrome://global/skin/pictureinpicture/player.css"/>
-     <link rel="localization" href="toolkit/pictureinpicture/pictureinpicture.ftl"/>
-+    <link rel="localization" href="browser/zen-general.ftl"/>
+@@ -17,6 +17,7 @@
      <link rel="localization" href="browser/browserSets.ftl"/>
      <script src="chrome://global/content/pictureinpicture/player.js"></script>
      <title data-l10n-id="pictureinpicture-player-title"></title>
++    <link rel="localization" href="browser/zen-general.ftl"/>
+   </head>
+ 
+   <body>
 @@ -52,13 +53,22 @@
        tabindex="10"
  #endif

From d9d8437b6dd9aa581e3b101ed54a5b1b8e880be1 Mon Sep 17 00:00:00 2001
From: Slowlife01 <slowlife1165@gmail.com>
Date: Sat, 22 Mar 2025 09:46:20 +0700
Subject: [PATCH 09/12] fix(MediaController): recheck overflow on metadata
 change

---
 src/browser/base/zen-components/ZenMediaController.mjs | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/src/browser/base/zen-components/ZenMediaController.mjs b/src/browser/base/zen-components/ZenMediaController.mjs
index 067451a36..19c28220a 100644
--- a/src/browser/base/zen-components/ZenMediaController.mjs
+++ b/src/browser/base/zen-components/ZenMediaController.mjs
@@ -396,6 +396,13 @@ class ZenMediaController {
     const metadata = event.target.getMetadata();
     this.mediaTitle.textContent = metadata.title || '';
     this.mediaArtist.textContent = metadata.artist || '';
+
+    const mediaInfoElements = [this.mediaTitle, this.mediaArtist];
+    for (const element of mediaInfoElements) {
+      element.removeAttribute('overflow');
+    }
+
+    this.addLabelOverflows(mediaInfoElements);
   }
 
   _onPictureInPictureModeChange(event) {

From 8959adf9e094fd7897a6f4ce90b4228a28b5aa92 Mon Sep 17 00:00:00 2001
From: NOCanoa <158103554+nocanoa@users.noreply.github.com>
Date: Sat, 22 Mar 2025 22:30:19 +0000
Subject: [PATCH 10/12] Update README.md to set user expectations

Signed-off-by: NOCanoa <158103554+nocanoa@users.noreply.github.com>
---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index d1ed17ff0..961798cef 100644
--- a/README.md
+++ b/README.md
@@ -6,7 +6,7 @@
 [![Crowdin](https://badges.crowdin.net/zen-browser/localized.svg)](https://crowdin.com/project/zen-browser)
 [![Zen Release builds](https://github.com/zen-browser/desktop/actions/workflows/build.yml/badge.svg?branch=stable)](https://github.com/zen-browser/desktop/actions/workflows/build.yml)
 
-✨ Experience tranquillity while browsing the web without people tracking you! Zen is a privacy-focused browser that blocks trackers, ads, and other unwanted content while offering the best browsing experience!
+✨ Experience tranquillity while browsing the internet with Zen! Our mission is to give you a balance between speed, privacy and productivity
 
 <div flex="true">
   <a href="https://zen-browser.app/download">

From d1505287b2750ec3e8895675025cd2fb9ff4b086 Mon Sep 17 00:00:00 2001
From: NOCanoa <158103554+nocanoa@users.noreply.github.com>
Date: Sat, 22 Mar 2025 22:30:56 +0000
Subject: [PATCH 11/12] Forgot ! xP

Signed-off-by: NOCanoa <158103554+nocanoa@users.noreply.github.com>
---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 961798cef..bd43bbb45 100644
--- a/README.md
+++ b/README.md
@@ -6,7 +6,7 @@
 [![Crowdin](https://badges.crowdin.net/zen-browser/localized.svg)](https://crowdin.com/project/zen-browser)
 [![Zen Release builds](https://github.com/zen-browser/desktop/actions/workflows/build.yml/badge.svg?branch=stable)](https://github.com/zen-browser/desktop/actions/workflows/build.yml)
 
-✨ Experience tranquillity while browsing the internet with Zen! Our mission is to give you a balance between speed, privacy and productivity
+✨ Experience tranquillity while browsing the internet with Zen! Our mission is to give you a balance between speed, privacy and productivity!
 
 <div flex="true">
   <a href="https://zen-browser.app/download">

From 8939e889f0684d8cf7ad21d53a29bc1d41e7507e Mon Sep 17 00:00:00 2001
From: "mr. m" <91018726+mauro-balades@users.noreply.github.com>
Date: Sun, 23 Mar 2025 10:41:26 +0100
Subject: [PATCH 12/12] Revert "Fix: fixed overflowing glance buttons when
 sidebar is opened"

---
 src/browser/base/content/zen-glance.inc.xhtml |   8 +-
 .../base/content/zen-styles/zen-glance.css    |  11 +-
 .../base/zen-components/ZenGlanceManager.mjs  | 100 +++++++-----------
 3 files changed, 41 insertions(+), 78 deletions(-)

diff --git a/src/browser/base/content/zen-glance.inc.xhtml b/src/browser/base/content/zen-glance.inc.xhtml
index 2a993f821..51891d19c 100644
--- a/src/browser/base/content/zen-glance.inc.xhtml
+++ b/src/browser/base/content/zen-glance.inc.xhtml
@@ -1,6 +1,4 @@
-<vbox id="glance-wrapper">
-  <vbox id="zen-glance-sidebar-container" hidden="true">
-    <toolbarbutton id="zen-glance-sidebar-close" data-l10n-id="zen-general-confrim" class="toolbarbutton-1" oncommand="gZenGlanceManager.closeGlance({ onTabClose: true })"/>
-    <toolbarbutton id="zen-glance-sidebar-open" class="toolbarbutton-1" oncommand="gZenGlanceManager.fullyOpenGlance()"/>
-  </vbox>
+<vbox id="zen-glance-sidebar-container" hidden="true">
+  <toolbarbutton id="zen-glance-sidebar-close" data-l10n-id="zen-general-confirm" class="toolbarbutton-1" oncommand="gZenGlanceManager.closeGlance({ onTabClose: true })"/>
+  <toolbarbutton id="zen-glance-sidebar-open" class="toolbarbutton-1" oncommand="gZenGlanceManager.fullyOpenGlance()"/>
 </vbox>
diff --git a/src/browser/base/content/zen-styles/zen-glance.css b/src/browser/base/content/zen-styles/zen-glance.css
index 6dacaa7f0..8dcd4513f 100644
--- a/src/browser/base/content/zen-styles/zen-glance.css
+++ b/src/browser/base/content/zen-styles/zen-glance.css
@@ -9,12 +9,6 @@
   visibility: inherit;
 }
 
-#glance-wrapper {
-  position: relative;
-  overflow: visible;
-  left: 2%;
-}
-
 #zen-glance-sidebar-container {
   position: absolute;
   display: flex;
@@ -29,6 +23,7 @@
 
   padding: 5px;
   gap: 12px;
+  left: 2%;
 
   & toolbarbutton {
     width: 32px;
@@ -93,10 +88,6 @@
   }
 }
 
-#zen-glance-sidebar-container[hidden='true'] {
-  display: none;
-}
-
 .browserSidebarContainer.zen-glance-overlay {
   box-shadow: none !important;
 
diff --git a/src/browser/base/zen-components/ZenGlanceManager.mjs b/src/browser/base/zen-components/ZenGlanceManager.mjs
index 5af4e8196..f6865c5dd 100644
--- a/src/browser/base/zen-components/ZenGlanceManager.mjs
+++ b/src/browser/base/zen-components/ZenGlanceManager.mjs
@@ -12,30 +12,33 @@
       window.addEventListener('TabClose', this.onTabClose.bind(this));
       window.addEventListener('TabSelect', this.onLocationChange.bind(this));
 
-      ChromeUtils.defineLazyGetter(this, 'sidebarButtons', () => document.getElementById('zen-glance-sidebar-container'));
-      document.getElementById('tabbrowser-tabpanels').addEventListener('click', this.onOverlayClick.bind(this));
-      Services.obs.addObserver(this, 'quit-application-requested');
-
       XPCOMUtils.defineLazyPreferenceGetter(
         this._lazyPref,
         'SHOULD_OPEN_EXTERNAL_TABS_IN_GLANCE',
         'zen.glance.open-essential-external-links',
         false
       );
+
+      ChromeUtils.defineLazyGetter(this, 'sidebarButtons', () => document.getElementById('zen-glance-sidebar-container'));
+
+      document.getElementById('tabbrowser-tabpanels').addEventListener('click', this.onOverlayClick.bind(this));
+
+      Services.obs.addObserver(this, 'quit-application-requested');
     }
 
     get #currentBrowser() {
       return this.#glances.get(this.#currentGlanceID)?.browser;
     }
+
     get #currentTab() {
       return this.#glances.get(this.#currentGlanceID)?.tab;
     }
+
     get #currentParentTab() {
       return this.#glances.get(this.#currentGlanceID)?.parentTab;
     }
 
     onOverlayClick(event) {
-      // If user clicks outside content area, close glance
       if (event.target === this.overlay && event.originalTarget !== this.contentWrapper) {
         this.closeGlance({ onTabClose: true });
       }
@@ -50,18 +53,16 @@
     }
 
     onUnload() {
-      // Clean up all open Glances
+      // clear everything
       for (let [id, glance] of this.#glances) {
         gBrowser.removeTab(glance.tab, { animate: false });
       }
     }
 
-    // Figure out where to insert new tabs
     getTabPosition(tab) {
       return Math.max(gBrowser.pinnedTabCount, tab._tPos);
     }
 
-    // Create a new tab for Glance
     createBrowserElement(url, currentTab, existingTab = null) {
       const newTabOptions = {
         userContextId: currentTab.getAttribute('usercontextid') || '',
@@ -71,21 +72,15 @@
         index: this.getTabPosition(currentTab) + 1,
       };
       currentTab._selected = true;
-
       const newUUID = gZenUIManager.generateUuidv4();
       const newTab = existingTab ?? gBrowser.addTrustedTab(Services.io.newURI(url).spec, newTabOptions);
-
-      // Example: copy any context ID
       if (currentTab.hasAttribute('zenDefaultUserContextId')) {
         newTab.setAttribute('zenDefaultUserContextId', true);
       }
-
-      // Insert the new tab as a child of the existing tab's content
       currentTab.querySelector('.tab-content').appendChild(newTab);
       newTab.setAttribute('zen-glance-tab', true);
       newTab.setAttribute('glance-id', newUUID);
       currentTab.setAttribute('glance-id', newUUID);
-
       this.#glances.set(newUUID, {
         tab: newTab,
         parentTab: currentTab,
@@ -97,14 +92,12 @@
     }
 
     fillOverlay(browser) {
-      // Save references to the parent containers
       this.overlay = browser.closest('.browserSidebarContainer');
       this.browserWrapper = browser.closest('.browserContainer');
       this.contentWrapper = browser.closest('.browserStack');
     }
 
     showSidebarButtons(animate = false) {
-      // Animate in if hidden
       if (this.sidebarButtons.hasAttribute('hidden') && animate) {
         gZenUIManager.motion.animate(
           this.sidebarButtons.querySelectorAll('toolbarbutton'),
@@ -120,57 +113,40 @@
     }
 
     openGlance(data, existingTab = null, ownerTab = null) {
-      // If a glance is already open, do nothing
       if (this.#currentBrowser) {
         return;
       }
-
-      // If the current parent tab is selected, switch to the glance tab
       if (gBrowser.selectedTab === this.#currentParentTab) {
         gBrowser.selectedTab = this.#currentTab;
         return;
       }
-
       this.animatingOpen = true;
       this._animating = true;
 
-      // Gather initial positions
       const initialX = data.x;
       const initialY = data.y;
       const initialWidth = data.width;
       const initialHeight = data.height;
 
-      // Clean up any leftover states
       this.browserWrapper?.removeAttribute('animate');
       this.browserWrapper?.removeAttribute('animate-end');
       this.browserWrapper?.removeAttribute('animate-full');
       this.browserWrapper?.removeAttribute('has-finished-animation');
       this.overlay?.removeAttribute('post-fade-out');
 
-      // Create the new tab
       const currentTab = ownerTab ?? gBrowser.selectedTab;
+
       const browserElement = this.createBrowserElement(data.url, currentTab, existingTab);
 
-      // Fill references
       this.fillOverlay(browserElement);
 
-      const container = document.getElementById('glance-wrapper');
-      if (container) {
-        container.appendChild(this.sidebarButtons);
-      }
-
-      // Start overlay
       this.overlay.classList.add('zen-glance-overlay');
 
-      // Animate open
       this.browserWrapper.removeAttribute('animate-end');
       window.requestAnimationFrame(() => {
-        // "Quick open" logic
         this.quickOpenGlance({ dontOpenButtons: true });
-        // Show the sidebar buttons
         this.showSidebarButtons(true);
 
-        // Animate the parent container
         gZenUIManager.motion.animate(
           this.#currentParentTab.linkedBrowser.closest('.browserSidebarContainer'),
           {
@@ -184,12 +160,9 @@
             bounce: 0.2,
           }
         );
-
-        // Start the transition
         this.#currentBrowser.setAttribute('animate-glance-open', true);
         this.overlay.removeAttribute('fade-out');
         this.browserWrapper.setAttribute('animate', true);
-
         const top = initialY + initialHeight / 2;
         const left = initialX + initialWidth / 2;
         this.browserWrapper.style.top = `${top}px`;
@@ -197,19 +170,14 @@
         this.browserWrapper.style.width = `${initialWidth}px`;
         this.browserWrapper.style.height = `${initialHeight}px`;
         this.browserWrapper.style.opacity = 0.8;
-
-        // Save original position for closing animation
         this.#glances.get(this.#currentGlanceID).originalPosition = {
           top: this.browserWrapper.style.top,
           left: this.browserWrapper.style.left,
           width: this.browserWrapper.style.width,
           height: this.browserWrapper.style.height,
         };
-
         this.browserWrapper.style.transform = 'translate(-50%, -50%)';
         this.overlay.style.overflow = 'visible';
-
-        // Animate up to final size
         gZenUIManager.motion
           .animate(
             this.browserWrapper,
@@ -268,27 +236,24 @@
       this.closingGlance = true;
       this._animating = true;
 
-      // Insert tab at correct index
       gBrowser._insertTabAtIndex(this.#currentTab, {
         index: this.getTabPosition(this.#currentParentTab),
       });
 
       let quikcCloseZen = false;
       if (onTabClose) {
-        // If there's only one tab left, open a new one
+        // Create new tab if no more ex
         if (gBrowser.tabs.length === 1) {
           BrowserCommands.openTab();
           return;
         }
       }
 
-      // do NOT touch here, unknown but functional
+      // do NOT touch here, I don't know what it does, but it works...
       this.#currentTab.style.display = 'none';
       this.overlay.setAttribute('fade-out', true);
       this.overlay.style.pointerEvents = 'none';
       this.quickCloseGlance({ justAnimateParent: true, clearID: false });
-
-      // Animate the parent container
       const originalPosition = this.#glances.get(this.#currentGlanceID).originalPosition;
       gZenUIManager.motion
         .animate(
@@ -324,11 +289,9 @@
             return;
           }
 
-          // Final close
           if (!onTabClose || quikcCloseZen) {
             this.quickCloseGlance({ clearID: false });
           }
-
           this.overlay.removeAttribute('fade-out');
           this.browserWrapper.removeAttribute('animate');
 
@@ -367,7 +330,6 @@
           this._animating = false;
           this.closingGlance = false;
 
-          // If we had another Glance queued, open it
           if (this.#currentGlanceID) {
             this.quickOpenGlance();
           }
@@ -387,7 +349,6 @@
       parentBrowserContainer.classList.add('zen-glance-background');
       parentBrowserContainer.classList.remove('zen-glance-overlay');
       parentBrowserContainer.classList.add('deck-selected');
-
       this.#currentParentTab.linkedBrowser.zenModeActive = true;
       this.#currentParentTab.linkedBrowser.docShellIsActive = true;
       this.#currentBrowser.zenModeActive = true;
@@ -493,6 +454,7 @@
           return false;
         }
         this.closeGlance({ onTabClose: true, setNewID: isDifferent ? oldGlanceID : null, isDifferent });
+        // only keep continueing tab close if we are not on the currently selected tab
         return !isDifferent;
       }
       return false;
@@ -500,9 +462,13 @@
 
     tabDomainsDiffer(tab1, url2) {
       try {
-        if (!tab1) return true;
+        if (!tab1) {
+          return true;
+        }
         let url1 = tab1.linkedBrowser.currentURI.spec;
-        if (url1.startsWith('about:')) return true;
+        if (url1.startsWith('about:')) {
+          return true;
+        }
         return Services.io.newURI(url1).host !== url2.host;
       } catch (e) {
         return true;
@@ -523,7 +489,9 @@
 
     onTabOpen(browser, uri) {
       let tab = gBrowser.getTabForBrowser(browser);
-      if (!tab) return;
+      if (!tab) {
+        return;
+      }
       try {
         if (this.shouldOpenTabInGlance(tab, uri)) {
           const browserRect = gBrowser.tabbox.getBoundingClientRect();
@@ -561,11 +529,9 @@
       this.#currentTab.removeAttribute('glance-id');
       this.#currentParentTab.removeAttribute('glance-id');
       gBrowser.selectedTab = this.#currentTab;
-
       this.#currentParentTab.linkedBrowser.closest('.browserSidebarContainer').classList.remove('zen-glance-background');
       this.#currentParentTab._visuallySelected = false;
       this.hideSidebarButtons();
-
       if (gReduceMotion) {
         this.finishOpeningGlance();
         return;
@@ -586,11 +552,18 @@
 
     openGlanceForBookmark(event) {
       const activationMethod = Services.prefs.getStringPref('zen.glance.activation-method', 'ctrl');
-      if (activationMethod === 'ctrl' && !event.ctrlKey) return;
-      if (activationMethod === 'alt' && !event.altKey) return;
-      if (activationMethod === 'shift' && !event.shiftKey) return;
-      if (activationMethod === 'meta' && !event.metaKey) return;
-      if (activationMethod === 'mantain' || typeof activationMethod === 'undefined') return;
+
+      if (activationMethod === 'ctrl' && !event.ctrlKey) {
+        return;
+      } else if (activationMethod === 'alt' && !event.altKey) {
+        return;
+      } else if (activationMethod === 'shift' && !event.shiftKey) {
+        return;
+      } else if (activationMethod === 'meta' && !event.metaKey) {
+        return;
+      } else if (activationMethod === 'mantain' || typeof activationMethod === 'undefined') {
+        return;
+      }
 
       event.preventDefault();
       event.stopPropagation();
@@ -603,7 +576,9 @@
         width: rect.width,
         height: rect.height,
       };
+
       this.openGlance(data);
+
       return false;
     }
 
@@ -612,10 +587,8 @@
     }
   }
 
-  // Expose globally
   window.gZenGlanceManager = new ZenGlanceManager();
 
-  // Register window actors if needed
   function registerWindowActors() {
     if (Services.prefs.getBoolPref('zen.glance.enabled', true)) {
       gZenActorsManager.addJSWindowActor('ZenGlance', {
@@ -636,5 +609,6 @@
       });
     }
   }
+
   registerWindowActors();
 }