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

Enhance sidebar behavior and styles: force expanded sidebar on initialization, adjust margins, and refine transition effects for compact mode

Browse Source
This commit is contained in:
mr. M
2024-12-14 21:02:00 +01:00
parent c077834553
commit 6ea43b65d3
5 changed files with 36 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -106,10 +106,10 @@ var gZenCompactModeManager = {
this._isAnimating = true;
const sidebarWidth = this.sidebar.getBoundingClientRect().width;
if (canHideSidebar && isCompactMode) {
document.getElementById('browser').style.overflow = "hidden";
this.sidebar.style.position = "relative";
this.sidebar.style.transition = "margin .3s ease, transform .4s ease, opacity .3s ease";
this.sidebar.style.transition = "margin .3s ease, opacity .3s ease";
this.sidebar.style.left = "0";
this.sidebar.style.setProperty("opacity", "1", "important");
if (!this.sidebarIsOnRight) {
this.sidebar.style.marginLeft = `${-1 * sidebarWidth}px`;
} else {
@@ -117,20 +117,23 @@ var gZenCompactModeManager = {
}
this.sidebar.style.pointerEvents = "none";
setTimeout(() => {
window.requestAnimationFrame(() => {
this._isAnimating = false;
this.sidebar.style.removeProperty("opacity");
this.sidebar.style.removeProperty("position");
this.sidebar.style.removeProperty("transition");
this.sidebar.style.removeProperty("pointer-events");
this.sidebar.style.removeProperty("margin-left");
this.sidebar.style.removeProperty("margin-right");
this.sidebar.style.removeProperty("transform");
this.sidebar.style.removeProperty("left");
document.getElementById('browser').style.removeProperty("overflow");
});
}, 400);
window.requestAnimationFrame(() => {
this.sidebar.style.removeProperty("opacity");
setTimeout(() => {
window.requestAnimationFrame(() => {
this._isAnimating = false;
this.sidebar.style.removeProperty("opacity");
this.sidebar.style.removeProperty("position");
this.sidebar.style.removeProperty("transition");
this.sidebar.style.removeProperty("pointer-events");
this.sidebar.style.removeProperty("margin-left");
this.sidebar.style.removeProperty("margin-right");
this.sidebar.style.removeProperty("transform");
this.sidebar.style.removeProperty("left");
document.getElementById('browser').style.removeProperty("overflow");
});
}, 500);
});
} else if (canHideSidebar && !isCompactMode) {
document.getElementById('browser').style.overflow = "hidden";
this.sidebar.style.position = "relative";
@@ -168,7 +171,7 @@ var gZenCompactModeManager = {
document.getElementById('browser').style.removeProperty("overflow");
});
}, 400);
}, 500);
});
}
},