diff --git a/src/zen/common/styles/zen-theme.css b/src/zen/common/styles/zen-theme.css index 76a134d4..2e50320f 100644 --- a/src/zen/common/styles/zen-theme.css +++ b/src/zen/common/styles/zen-theme.css @@ -154,6 +154,9 @@ --urlbar-box-hover-bgcolor: var(--toolbarbutton-hover-background) !important; --input-bgcolor: light-dark(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)) !important; + /* Transitions */ + --zen-tabbox-element-indent-transition: margin-inline-start 0.1s ease-in-out; + /* XUL */ --zen-main-browser-background: light-dark(rgb(235, 235, 235), #1b1b1b); --zen-main-browser-background-toolbar: var(--zen-main-browser-background); diff --git a/src/zen/folders/ZenFolders.mjs b/src/zen/folders/ZenFolders.mjs index a0368612..27f5b20b 100644 --- a/src/zen/folders/ZenFolders.mjs +++ b/src/zen/folders/ZenFolders.mjs @@ -344,12 +344,14 @@ // Calculate the height we need to hide until we reach the selected item. let heightUntilSelected; if (selectedItem) { - const selectedContainer = selectedItem.group?.hasAttribute('split-view-group') - ? selectedItem.group - : selectedItem; + const isSplitView = selectedItem.group?.hasAttribute('split-view-group'); + const selectedContainer = isSplitView ? selectedItem.group : selectedItem; heightUntilSelected = window.windowUtils.getBoundsWithoutFlushing(selectedContainer).top - window.windowUtils.getBoundsWithoutFlushing(groupStart).bottom; + if (isSplitView) { + heightUntilSelected -= 2; + } } else { heightUntilSelected = window.windowUtils.getBoundsWithoutFlushing(tabsContainer).height; } @@ -521,7 +523,7 @@ #onNewFolder(event) { const isFromToolbar = event.target.id === 'zen-context-menu-new-folder-toolbar'; const contextMenu = event.target.parentElement; - let tabs = TabContextMenu.contextTab.multiselected + let tabs = TabContextMenu.contextTab?.multiselected ? gBrowser.selectedTabs : [TabContextMenu.contextTab]; let triggerTab = diff --git a/src/zen/folders/zen-folders.css b/src/zen/folders/zen-folders.css index daa0c052..68efcdc2 100644 --- a/src/zen/folders/zen-folders.css +++ b/src/zen/folders/zen-folders.css @@ -7,8 +7,10 @@ tab-group[split-view-group] { display: block; @media (prefers-reduced-motion: no-preference) { - #tabbrowser-tabs[movingtab] &:not(:active) { - transition: var(--tab-dragover-transition); + transition: var(--zen-tabbox-element-indent-transition); + + #tabbrowser-tabs[movingtab] & { + transition: var(--zen-tabbox-element-indent-transition); } } --zen-split-view-active-tab-bg: color-mix( @@ -19,10 +21,6 @@ tab-group[split-view-group] { margin-inline-start: var(--zen-folder-indent) !important; - #tabbrowser-tabs[movingtab] & { - transition: margin-inline-start 0.15s ease-in-out; - } - & .tab-group-label { height: 100% !important; } @@ -194,7 +192,7 @@ zen-folder { ); -moz-window-dragging: no-drag; - transition: margin-inline-start 0.15s ease-in-out; + transition: var(--zen-tabbox-element-indent-transition); margin-inline-start: var(--zen-folder-indent) !important; @@ -226,7 +224,7 @@ zen-folder { } & > zen-folder { - transition: margin-inline-start 0.15s ease-in-out; + transition: var(--zen-tabbox-element-indent-transition); } & > tab::before { diff --git a/src/zen/tabs/zen-tabs/vertical-tabs.css b/src/zen/tabs/zen-tabs/vertical-tabs.css index fa56a426..71a98416 100644 --- a/src/zen/tabs/zen-tabs/vertical-tabs.css +++ b/src/zen/tabs/zen-tabs/vertical-tabs.css @@ -292,7 +292,7 @@ & .tab-content > image { transition: scale 0.07s ease, - margin-inline-start 0.15s ease-in-out; + var(--zen-tabbox-element-indent-transition); } margin-inline-start: var(--zen-folder-indent) !important;