Fix stacked mode layout when toggle item pane

This commit is contained in:
windingwind 2024-01-23 16:57:16 +08:00 committed by Dan Stillman
parent 8aa77fd5c8
commit 3bdcf34a89
3 changed files with 39 additions and 23 deletions

View file

@ -1973,24 +1973,26 @@ var ZoteroPane = new function()
} }
} }
let isStackedMode = Zotero.Prefs.get("layout") === "stacked"; if (!document.querySelector("#zotero-items-splitter").collapsed) {
const sidenavSize = 37; let isStackedMode = Zotero.Prefs.get("layout") === "stacked";
if (hideSidenav && !sidenav.hidden) { const sidenavSize = 37;
sidenav.hidden = true; if (hideSidenav && !sidenav.hidden) {
if (isStackedMode) { sidenav.hidden = true;
pane.height = `${(pane.clientHeight) + sidenavSize}`; if (isStackedMode) {
pane.height = `${(pane.clientHeight) + sidenavSize}`;
}
else {
pane.width = `${(pane.clientWidth) + sidenavSize}`;
}
} }
else { else if (!hideSidenav && sidenav.hidden) {
pane.width = `${(pane.clientWidth) + sidenavSize}`; sidenav.hidden = false;
} if (isStackedMode) {
} pane.height = `${(pane.clientHeight) - sidenavSize}`;
else if (!hideSidenav && sidenav.hidden) { }
sidenav.hidden = false; else {
if (isStackedMode) { pane.width = `${(pane.clientWidth) - sidenavSize}`;
pane.height = `${(pane.clientHeight) - sidenavSize}`; }
}
else {
pane.width = `${(pane.clientWidth) - sidenavSize}`;
} }
} }

View file

@ -186,6 +186,8 @@
{ {
width: 342px; width: 342px;
min-width: 342px; min-width: 342px;
/* Need a min height to prevent layout issues in stacked mode */
min-height: 168px;
} }
#zotero-layout-switcher #zotero-layout-switcher

View file

@ -69,11 +69,23 @@ splitter {
} }
#zotero-items-splitter, #zotero-items-splitter,
#zotero-context-splitter { #zotero-context-splitter,
@include splitter-invisible-size(right); #zotero-context-splitter-stacked {
&[state="collapsed"] { &[orient=vertical] {
--draggable-size: 1px; &[state="collapsed"] {
border: 0; margin-bottom: -1px;
margin-left: -1px; --draggable-size: 1px;
border: 0;
}
}
&:not([orient=vertical]) {
@include splitter-invisible-size(right);
&[state="collapsed"] {
margin-right: -1px;
--draggable-size: 1px;
border: 0;
}
} }
} }