From 7470df4cf66294f258f0ceddb3e7cffd8804c3fa Mon Sep 17 00:00:00 2001 From: "mr. m" Date: Sun, 4 Jan 2026 19:15:18 +0100 Subject: [PATCH] feat: Fixed creating new unsynced windows rendering the window blank, b=no-bug, c=common, tabs, workspaces --- locales/en-US/browser/browser/zen-menubar.ftl | 5 +- src/zen/common/modules/ZenMenubar.mjs | 1 + src/zen/common/styles/zen-browser-ui.css | 2 + src/zen/drag-and-drop/ZenDragAndDrop.js | 4 +- src/zen/tabs/zen-tabs/vertical-tabs.css | 1 + src/zen/workspaces/ZenGradientGenerator.mjs | 4 +- src/zen/workspaces/ZenWorkspaces.mjs | 63 ++++++++----------- 7 files changed, 39 insertions(+), 41 deletions(-) diff --git a/locales/en-US/browser/browser/zen-menubar.ftl b/locales/en-US/browser/browser/zen-menubar.ftl index 18de7940a..6293e01a8 100644 --- a/locales/en-US/browser/browser/zen-menubar.ftl +++ b/locales/en-US/browser/browser/zen-menubar.ftl @@ -10,7 +10,10 @@ zen-menubar-toggle-pinned-tabs = } zen-menubar-appearance = - .label = Website Appearance + .label = Appearance + +zen-menubar-appearance-description = + .label = Websites will use: zen-menubar-appearance-auto = .label = Automatic diff --git a/src/zen/common/modules/ZenMenubar.mjs b/src/zen/common/modules/ZenMenubar.mjs index 9a9fdce27..55167f9be 100644 --- a/src/zen/common/modules/ZenMenubar.mjs +++ b/src/zen/common/modules/ZenMenubar.mjs @@ -19,6 +19,7 @@ class nsZenMenuBar { let appearanceMenu = window.MozXULElement.parseXULToFragment(` + diff --git a/src/zen/common/styles/zen-browser-ui.css b/src/zen/common/styles/zen-browser-ui.css index a46036d07..72b34c96c 100644 --- a/src/zen/common/styles/zen-browser-ui.css +++ b/src/zen/common/styles/zen-browser-ui.css @@ -58,6 +58,7 @@ background: var(--zen-main-browser-background); opacity: var(--zen-background-opacity); transition: 0s; + background-blend-mode: screen; } &:is(.zen-toolbar-background) { @@ -70,6 +71,7 @@ background: var(--zen-main-browser-background-old); opacity: calc(1 - var(--zen-background-opacity)); transition: 0s; + background-blend-mode: screen; } &:is(.zen-toolbar-background) { diff --git a/src/zen/drag-and-drop/ZenDragAndDrop.js b/src/zen/drag-and-drop/ZenDragAndDrop.js index e86823cf9..99328aa6a 100644 --- a/src/zen/drag-and-drop/ZenDragAndDrop.js +++ b/src/zen/drag-and-drop/ZenDragAndDrop.js @@ -122,7 +122,9 @@ } // Apply a transform translate to the tab in order to center it within the drag image // based on the event coordinates. - tabClone.style.transform = `translate(${(tabRect.width - dragData.offsetX) / 2}px, ${(tabRect.height - dragData.offsetY) / 2}px)`; + if (!movingTabs.length > 1) { + tabClone.style.transform = `translate(${(tabRect.width - dragData.offsetX) / 2}px, ${(tabRect.height - dragData.offsetY) / 2}px)`; + } wrapper.appendChild(tabClone); } this.#maybeCreateDragImageDot(movingTabs, wrapper); diff --git a/src/zen/tabs/zen-tabs/vertical-tabs.css b/src/zen/tabs/zen-tabs/vertical-tabs.css index d316d5296..47807cf3f 100644 --- a/src/zen/tabs/zen-tabs/vertical-tabs.css +++ b/src/zen/tabs/zen-tabs/vertical-tabs.css @@ -1063,6 +1063,7 @@ @media -moz-pref('zen.tabs.show-newtab-vertical') { #tabs-newtab-button { + max-height: var(--tab-min-height); display: flex !important; transition: scale 0.1s ease; #tabbrowser-tabs[movingtab] & { diff --git a/src/zen/workspaces/ZenGradientGenerator.mjs b/src/zen/workspaces/ZenGradientGenerator.mjs index e9dc74ed4..48e48ef55 100644 --- a/src/zen/workspaces/ZenGradientGenerator.mjs +++ b/src/zen/workspaces/ZenGradientGenerator.mjs @@ -1216,9 +1216,9 @@ export class nsZenThemePicker extends nsZenMultiWindowFeature { let color2 = this.getSingleRGBColor(themedColors[0], forToolbar); let color3 = this.getSingleRGBColor(themedColors[1], forToolbar); return [ - `linear-gradient(-5deg, ${color1} 0%, transparent 90%)`, + `linear-gradient(-5deg, ${color1} 10%, transparent 80%)`, `radial-gradient(circle at 95% 0%, ${color3} 0%, transparent 75%)`, - `radial-gradient(circle at 0% 0%, ${color2} 0%, transparent 200%)`, + `radial-gradient(circle at 0% 0%, ${color2} 10%, transparent 70%)`, ].join(', '); } } diff --git a/src/zen/workspaces/ZenWorkspaces.mjs b/src/zen/workspaces/ZenWorkspaces.mjs index 01f17d39c..87aa0f796 100644 --- a/src/zen/workspaces/ZenWorkspaces.mjs +++ b/src/zen/workspaces/ZenWorkspaces.mjs @@ -438,7 +438,9 @@ class nsZenWorkspaces { getCurrentSpaceContainerId() { const currentWorkspace = this.getActiveWorkspaceFromCache(); - return currentWorkspace?.containerTabId || 0; + return typeof currentWorkspace?.containerTabId === 'number' + ? currentWorkspace.containerTabId + : 0; } getCurrentEssentialsContainer() { @@ -812,10 +814,6 @@ class nsZenWorkspaces { ); return ZenSessionStore.getClonedSpaces(); } - if (!this.currentWindowIsSyncing) { - this._workspaceCache = this._tempWorkspace ? [this._tempWorkspace] : []; - this.#activeWorkspace = this._tempWorkspace?.uuid; - } return [...this._workspaceCache]; } @@ -1894,28 +1892,23 @@ class nsZenWorkspaces { previousBackgroundOpacity = 1 - previousBackgroundOpacity; } gZenThemePicker.previousBackgroundOpacity = previousBackgroundOpacity; - await new Promise((resolve) => { - requestAnimationFrame(() => { - document.documentElement.style.setProperty( - '--zen-background-opacity', - previousBackgroundOpacity - ); - animations.push( - gZenUIManager.motion.animate( - document.documentElement, - { - '--zen-background-opacity': [previousBackgroundOpacity, 1], - }, - { - type: 'spring', - bounce: 0, - duration: kGlobalAnimationDuration, - } - ) - ); - resolve(); - }); - }); + document.documentElement.style.setProperty( + '--zen-background-opacity', + previousBackgroundOpacity + ); + animations.push( + gZenUIManager.motion.animate( + document.documentElement, + { + '--zen-background-opacity': [previousBackgroundOpacity, 1], + }, + { + type: 'spring', + bounce: 0, + duration: kGlobalAnimationDuration, + } + ) + ); } for (const element of document.querySelectorAll('zen-workspace')) { if (element.classList.contains('zen-essentials-container')) { @@ -2385,6 +2378,11 @@ class nsZenWorkspaces { } #createWorkspaceData(name, icon, containerTabId = 0) { + if (!this.currentWindowIsSyncing) { + containerTabId = parseInt(gBrowser.selectedTab.getAttribute('usercontextid')) || 0; + let label = ContextualIdentityService.getUserContextLabel(containerTabId) || 'Default'; + name = this.isPrivateWindow ? 'Private ' + name : label; + } let workspace = { uuid: gZenUIManager.generateUuidv4(), icon: icon, @@ -2405,11 +2403,6 @@ class nsZenWorkspaces { if (!this.workspaceEnabled) { return; } - if (!this.currentWindowIsSyncing) { - containerTabId = parseInt(gBrowser.selectedTab.getAttribute('usercontextid')) || 0; - let label = ContextualIdentityService.getUserContextLabel(containerTabId) || 'Default'; - name = this.isPrivateWindow ? 'Private ' + name : label; - } // get extra tabs remaning (e.g. on new profiles) and just move them to the new workspace const extraTabs = Array.from(gBrowser.tabContainer.arrowScrollbox.children).filter( (child) => @@ -2424,11 +2417,7 @@ class nsZenWorkspaces { this.#createWorkspaceTabsSection(workspaceData, extraTabs); await this._organizeWorkspaceStripLocations(workspaceData); } - if (!this.currentWindowIsSyncing) { - this._tempWorkspace = workspaceData; - } else { - this.saveWorkspace(workspaceData); - } + this.saveWorkspace(workspaceData); if (!dontChange) { if (beforeChangeCallback) { try {