mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2026-01-22 04:40:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

Refactor CSS and JavaScript for Zen Glance feature to improve style management and enhance tab handling

Browse Source
This commit is contained in:
mr. M
2025-03-30 00:02:24 +01:00
parent fd99c13ee7
commit 2408524660
3 changed files with 26 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/browser/base/content/zen-styles/zen-decks.css
View File

@@ -44,7 +44,14 @@
}
#tabbrowser-tabpanels[zen-split-view='true'] .browserSidebarContainer.deck-selected {
outline: 1px solid var(--zen-primary-color) !important;
&:not(.zen-glance-overlay) {
outline: 1px solid var(--zen-primary-color) !important;
}
&.zen-glance-overlay {
flex: 1;
margin-top: calc(var(--zen-element-separation) / 2);
}
}
#tabbrowser-tabbox:has(#tabbrowser-tabpanels[zen-split-view='true']) {

16
src/browser/base/zen-components/ZenGlanceManager.mjs
View File

@@ -206,6 +206,14 @@
});
}
_clearContainerStyles(container) {
const inset = container.style.inset;
window.requestAnimationFrame(() => {
container.removeAttribute('style');
container.style.inset = inset;
});
}
closeGlance({ noAnimation = false, onTabClose = false, setNewID = null, isDifferent = false, hasFocused = false } = {}) {
if (this._animating || !this.#currentBrowser || this.animatingOpen || this._duringOpening) {
return;
@@ -228,7 +236,7 @@
this.browserWrapper.removeAttribute('has-finished-animation');
if (noAnimation) {
this.#currentParentTab.linkedBrowser.closest('.browserSidebarContainer').removeAttribute('style');
this._clearContainerStyles(this.#currentParentTab.linkedBrowser.closest('.browserSidebarContainer'));
this.quickCloseGlance({ closeCurrentTab: false });
return;
}
@@ -270,7 +278,7 @@
}
)
.then(() => {
this.#currentParentTab.linkedBrowser.closest('.browserSidebarContainer').removeAttribute('style');
this._clearContainerStyles(this.#currentParentTab.linkedBrowser.closest('.browserSidebarContainer'));
});
this.browserWrapper.style.opacity = 1;
gZenUIManager.motion
@@ -510,7 +518,7 @@
ZenWorkspaces.updateTabsContainers();
this.browserWrapper.removeAttribute('animate-full');
this.overlay.classList.remove('zen-glance-overlay');
this.browserWrapper.removeAttribute('style');
this._clearContainerStyles(this.browserWrapper);
this.animatingFullOpen = false;
this.closeGlance({ noAnimation: true });
this.#glances.delete(this.#currentGlanceID);
@@ -522,7 +530,7 @@
index: this.getTabPosition(this.#currentTab),
});
this.browserWrapper.removeAttribute('style');
this._clearContainerStyles(this.browserWrapper);
this.browserWrapper.removeAttribute('has-finished-animation');
this.browserWrapper.setAttribute('animate-full', true);
this.#currentTab.removeAttribute('zen-glance-tab');

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

@@ -914,7 +914,12 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
*/
async onLocationChange(browser) {
this.disableTabRearrangeView();
const tab = window.gBrowser.getTabForBrowser(browser);
let tab = window.gBrowser.getTabForBrowser(browser);
if (tab.hasAttribute('zen-glance-tab')) {
// Extract from parent node so we are not selecting the wrong (current) tab
tab = tab.parentNode.closest('.tabbrowser-tab');
console.assert(tab, 'Tab not found for zen-glance-tab');
}
this.updateSplitViewButton(!tab?.splitView);
if (tab) {
this.updateSplitView(tab);