diff --git a/src/browser/base/content/zen-styles/zen-media-controls.css b/src/browser/base/content/zen-styles/zen-media-controls.css index 83a2d6802..98eb009b2 100644 --- a/src/browser/base/content/zen-styles/zen-media-controls.css +++ b/src/browser/base/content/zen-styles/zen-media-controls.css @@ -1,5 +1,5 @@ #zen-media-controls-toolbar { - --progress-height: 5px; + --progress-height: 4px; --button-spacing: 2px; display: flex; @@ -50,8 +50,8 @@ &::-moz-range-thumb { background: var(--zen-primary-color); border: none; - width: 14px; - height: 14px; + width: calc(var(--progress-height) * 2.5); + height:calc(var(--progress-height) * 2.5); border-radius: 50%; cursor: pointer; } @@ -84,7 +84,7 @@ top: -50%; left: 50%; transform: translateX(-50%); - z-index: -1; + z-index: 0; pointer-events: none; } @@ -93,21 +93,7 @@ transition: opacity 0.2s ease, transform 0.2s ease; - - @container (max-width: 185px) { - width: 0; - height: 0; - opacity: 0; - padding: 0; - margin-right: -10%; - transform: translateX(-20px); - transition: margin 0.15s ease-in-out; - } - - @container (min-width: 185px) { - opacity: 1; - transform: translateX(0); - } + position: relative; } toolbaritem { @@ -119,7 +105,7 @@ bottom: 0; padding: 4px; border-radius: var(--border-radius-medium); - background: light-dark(rgb(255, 255, 255), rgb(11, 11, 11)) !important; + background: light-dark(rgb(255, 255, 255), rgb(7, 7, 7)) !important; width: 100%; box-shadow: 0 0 10px rgba(0, 0, 0, 0.05); } @@ -127,13 +113,13 @@ .show-on-hover { max-height: 0; opacity: 0; - transform: translateY(5px); + transform: translateY(10px); padding: 0 6px; transition: - max-height 0.15s ease-in-out, - opacity 0.15s ease-in-out, - transform 0.1s ease-in-out, - padding 0.1s ease-in-out; + max-height 0.2s ease-out, + opacity 0.2s ease-out, + transform 0.2s ease-out, + padding 0.2s ease-out; } #zen-media-current-time, @@ -190,11 +176,13 @@ } #zen-media-info-vbox { + transition-delay: 0.01s; & label { width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; + min-height: 16px; } } @@ -210,6 +198,7 @@ flex-grow: 1; height: 1.1rem; align-items: center; + padding-top: 0px; } #zen-media-controls-hbox { diff --git a/src/browser/base/zen-components/ZenWorkspaces.mjs b/src/browser/base/zen-components/ZenWorkspaces.mjs index 03c18e9aa..e70833a60 100644 --- a/src/browser/base/zen-components/ZenWorkspaces.mjs +++ b/src/browser/base/zen-components/ZenWorkspaces.mjs @@ -2373,9 +2373,12 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature { async switchIfNeeded(browser, i) { const tab = gBrowser.getTabForBrowser(browser); - const workspaceId = tab.getAttribute('zen-workspace-id'); - if (!tab.hasAttribute('zen-essential') && workspaceId !== this.activeWorkspace) { - await this.changeWorkspace({ uuid: workspaceId }); + await this.switchTabIfNeeded(tab); + } + + async switchTabIfNeeded(tab) { + if (!tab.hasAttribute('zen-essential') && tab.getAttribute('zen-workspace-id') !== this.activeWorkspace) { + await this.changeWorkspace({ uuid: tab.getAttribute('zen-workspace-id') }); } gBrowser.selectedTab = tab; } diff --git a/src/browser/components/tabbrowser/content/tabbrowser-js.patch b/src/browser/components/tabbrowser/content/tabbrowser-js.patch index d288a20db..00517a651 100644 --- a/src/browser/components/tabbrowser/content/tabbrowser-js.patch +++ b/src/browser/components/tabbrowser/content/tabbrowser-js.patch @@ -1,5 +1,5 @@ diff --git a/browser/components/tabbrowser/content/tabbrowser.js b/browser/components/tabbrowser/content/tabbrowser.js -index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad72079b02024 100644 +index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f8a96152feea39b55c9b9cd14dff991bacb7b545 100644 --- a/browser/components/tabbrowser/content/tabbrowser.js +++ b/browser/components/tabbrowser/content/tabbrowser.js @@ -412,11 +412,50 @@ @@ -578,6 +578,15 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad720 if (aIndex < numPinned || (aTab.pinned && aIndex == numPinned)) { params.pinned = true; } +@@ -6513,7 +6661,7 @@ + // preventDefault(). It will still raise the window if appropriate. + break; + } +- this.selectedTab = tab; ++ ZenWorkspaces.switchTabIfNeeded(tab); + window.focus(); + aEvent.preventDefault(); + break; @@ -7415,6 +7563,7 @@ aWebProgress.isTopLevel ) {