diff --git a/src/browser/base/content/ZenUIManager.mjs b/src/browser/base/content/ZenUIManager.mjs index ca1aaecd3..a20dafdef 100644 --- a/src/browser/base/content/ZenUIManager.mjs +++ b/src/browser/base/content/ZenUIManager.mjs @@ -35,7 +35,7 @@ var gZenUIManager = { updateTabsToolbar() { // Set tabs max-height to the "toolbar-items" height - const tabs = document.getElementById('zen-browser-tabs-wrapper'); + const tabs = this.tabsWrapper; // Remove tabs so we can accurately calculate the height // without them affecting the height of the toolbar for (const tab of gBrowser.tabs) { @@ -414,7 +414,10 @@ var gZenVerticalTabsManager = { gBrowser.tabContainer.setAttribute('orient', isVerticalTabs ? 'vertical' : 'horizontal'); gBrowser.tabContainer.arrowScrollbox.setAttribute('orient', isVerticalTabs ? 'vertical' : 'horizontal'); // on purpose, we set the orient to horizontal, because the arrowScrollbox is vertical - gBrowser.tabContainer.arrowScrollbox.scrollbox.setAttribute('orient', (isVerticalTabs && ZenWorkspaces.workspaceEnabled) ? 'horizontal' : 'vertical'); + gBrowser.tabContainer.arrowScrollbox.scrollbox.setAttribute( + 'orient', + isVerticalTabs && ZenWorkspaces.workspaceEnabled ? 'horizontal' : 'vertical' + ); const buttonsTarget = document.getElementById('zen-sidebar-top-buttons-customization-target'); if (isRightSide) { diff --git a/src/browser/base/content/navigator-toolbox-inc-xhtml.patch b/src/browser/base/content/navigator-toolbox-inc-xhtml.patch index bc2ef52de..0419daa0c 100644 --- a/src/browser/base/content/navigator-toolbox-inc-xhtml.patch +++ b/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 a0a382643a2f74b6d789f3641ef300eed202d5e9..340475da315e67b2dd4f93567547cde703a90ee8 100644 +index a0a382643a2f74b6d789f3641ef300eed202d5e9..fd60aceee18e22d40c7d86506408803e3f4ffd45 100644 --- a/browser/base/content/navigator-toolbox.inc.xhtml +++ b/browser/base/content/navigator-toolbox.inc.xhtml @@ -2,7 +2,7 @@ @@ -40,17 +40,18 @@ index a0a382643a2f74b6d789f3641ef300eed202d5e9..340475da315e67b2dd4f93567547cde7 + + + ++ + @@ -83,7 +85,7 @@ index a0a382643a2f74b6d789f3641ef300eed202d5e9..340475da315e67b2dd4f93567547cde7 diff --git a/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css b/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css index a5ca41b3f..5efc7354f 100644 --- a/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css +++ b/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css @@ -368,9 +368,12 @@ #zen-browser-tabs-wrapper { min-height: fit-content; overflow-y: auto; - overflow-x: clip !important; /* might break custom css with new design, so let's force it */ height: 100%; scrollbar-width: thin; +} + +#zen-browser-tabs-container { + overflow-x: clip !important; /* might break custom css with new design, so let's force it */ position: relative; } diff --git a/src/browser/base/zen-components/ZenWorkspaces.mjs b/src/browser/base/zen-components/ZenWorkspaces.mjs index 01da4272b..e622626b8 100644 --- a/src/browser/base/zen-components/ZenWorkspaces.mjs +++ b/src/browser/base/zen-components/ZenWorkspaces.mjs @@ -1464,13 +1464,11 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature { for (const container of document.querySelectorAll(selector)) { container.style.transform = `translateX(${newTransform + offsetPixels / 2}%)`; container.style.opacity = offsetPixels ? 1 : !newTransform; - } - if (!justMove) { - const pinnedContainerId = '#vertical-pinned-tabs-container '; - const arrowScrollboxId = '#tabbrowser-arrowscrollbox '; - const pinnedContainer = document.querySelector(pinnedContainerId + selector); - const arrowScrollbox = document.querySelector(arrowScrollboxId + selector); - this._updateMarginTopPinnedTabs(arrowScrollbox, pinnedContainer); + if (!offsetPixels && !container.hasAttribute('active')) { + container.style.position = 'fixed'; + } else { + container.style.removeProperty('position'); + } } } } @@ -1513,6 +1511,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature { const newTransform = `translateX(${offset}%)`; const isCurrent = offset === 0; if (shouldAnimate) { + element.style.removeProperty('position'); if (isCurrent) { element.style.opacity = 1; } @@ -1534,7 +1533,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature { } if (offset === 0) { element.setAttribute('active', 'true'); - if (tabToSelect) { + if (tabToSelect != gBrowser.selectedTab) { gBrowser.selectedTab = tabToSelect; tabToSelect._visuallySelected = false; } @@ -1647,7 +1646,10 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature { gZenThemePicker.onWorkspaceChange(window); + document.getElementById('zen-browser-tabs-wrapper').style.scrollbarWidth = 'none'; await this._animateTabs(window, !onInit && !this._animatingChange, tabToSelect); + await this._organizeWorkspaceStripLocations(window, true); + document.getElementById('zen-browser-tabs-wrapper').style.scrollbarWidth = ''; // Notify listeners if (this._changeListeners?.length) {