mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2025-10-07 10:26:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fixed compact mode sidebar animating on an empty state and not animating properly

Browse Source
This commit is contained in:
mr. m
2025-03-02 18:21:18 +01:00
parent ff25a5b432
commit 7cb1ae6d3c
3 changed files with 11 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/browser/base/content/zen-styles/zen-compact-mode.css
View File

@@ -113,6 +113,7 @@
& #urlbar[open][zen-floating-urlbar='true'] { & #urlbar[open][zen-floating-urlbar='true'] {
transition: left 0.05s ease; transition: left 0.05s ease;
visibility: visible;
#navigator-toolbox:has(&) { #navigator-toolbox:has(&) {
opacity: 1; opacity: 1;
@@ -134,17 +135,18 @@
} }
} }
#navigator-toolbox[zen-has-hover], #navigator-toolbox[zen-has-hover]:not(:has(#urlbar[zen-floating-urlbar='true']:hover)),
#navigator-toolbox[zen-user-show], #navigator-toolbox[zen-user-show],
#navigator-toolbox[zen-has-empty-tab],
#navigator-toolbox[flash-popup], #navigator-toolbox[flash-popup],
#navigator-toolbox[has-popup-menu], #navigator-toolbox[has-popup-menu],
#navigator-toolbox[movingtab], #navigator-toolbox[movingtab],
#navigator-toolbox:has(.tabbrowser-tab:active), #navigator-toolbox:has(.tabbrowser-tab:active),
&[zen-renaming-tab='true'] #navigator-toolbox, &[zen-renaming-tab='true'] #navigator-toolbox,
#navigator-toolbox:has( #navigator-toolbox:has(
*:is([panelopen='true'], [open='true'], #urlbar:not([zen-floating-urlbar='true']):focus-within):not(tab):not(.zen-compact-mode-ignore) *:is([panelopen='true'], [open='true'], #urlbar:focus-within):not(#urlbar[zen-floating-urlbar='true']):not(tab):not(.zen-compact-mode-ignore)
) { ) {
&:not([animate='true']):not(:has(#urlbar[zen-floating-urlbar='true']:hover)) { &:not([animate='true']) {
--zen-compact-mode-func: linear( --zen-compact-mode-func: linear(
0 0%, 0 0%,
0.002748 1%, 0.002748 1%,

7
src/browser/base/zen-components/ZenCompactMode.mjs
View File

@@ -158,6 +158,7 @@ var gZenCompactModeManager = {
const canAnimate = const canAnimate =
lazyCompactMode.COMPACT_MODE_CAN_ANIMATE_SIDEBAR && lazyCompactMode.COMPACT_MODE_CAN_ANIMATE_SIDEBAR &&
!this.sidebar.hasAttribute('zen-user-show') && !this.sidebar.hasAttribute('zen-user-show') &&
!this.sidebar.hasAttribute('zen-has-empty-tab') &&
!this.sidebar.hasAttribute('zen-has-hover'); !this.sidebar.hasAttribute('zen-has-hover');
// Do this so we can get the correct width ONCE compact mode styled have been applied // Do this so we can get the correct width ONCE compact mode styled have been applied
if (canAnimate) { if (canAnimate) {
@@ -191,15 +192,17 @@ var gZenCompactModeManager = {
) )
.then(() => { .then(() => {
window.requestAnimationFrame(() => { window.requestAnimationFrame(() => {
this.sidebar.style.transition = 'none';
this.sidebar.removeAttribute('animate'); this.sidebar.removeAttribute('animate');
this.sidebar.style.visibility = 'hidden';
this.sidebar.style.removeProperty('margin-right'); this.sidebar.style.removeProperty('margin-right');
this.sidebar.style.removeProperty('margin-left'); this.sidebar.style.removeProperty('margin-left');
this.sidebar.style.removeProperty('transform'); this.sidebar.style.removeProperty('transform');
this.sidebar.style.transition = 'none';
setTimeout(() => { setTimeout(() => {
this._animating = false; this._animating = false;
this.sidebar.style.removeProperty('visibility');
this.sidebar.style.removeProperty('transition'); this.sidebar.style.removeProperty('transition');
}); }, 300);
}); });
}); });
} else if (canHideSidebar && !isCompactMode) { } else if (canHideSidebar && !isCompactMode) {

1
src/browser/base/zen-components/ZenWorkspaces.mjs
View File

@@ -1967,6 +1967,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
} }
async onLocationChange(browser) { async onLocationChange(browser) {
gZenCompactModeManager.sidebar.toggleAttribute('zen-has-empty-tab', gBrowser.selectedTab.hasAttribute('zen-empty-tab'));
if (!this.workspaceEnabled || this._inChangingWorkspace || this._isClosingWindow) { if (!this.workspaceEnabled || this._inChangingWorkspace || this._isClosingWindow) {
return; return;
} }