Add resizable viewer panes

This commit is contained in:
DonVoo 2026-07-06 07:37:28 +02:00
parent a4ea4c120e
commit 2bdf622257
3 changed files with 110 additions and 7 deletions

View file

@ -56,13 +56,22 @@ body.ol2013 {
min-height: 0; /* erlaubt Scrollen in den Panes */
}
.three-pane { grid-template-columns: 220px 340px 1fr; }
.four-pane { grid-template-columns: 220px 340px minmax(280px, 1fr) minmax(280px, 1fr); }
.four-pane { grid-template-columns: 220px 6px 340px 6px minmax(280px, 1fr) 6px minmax(280px, 1fr); }
.pane {
border-right: 1px solid var(--ol-border);
background: var(--ol-pane);
overflow-y: auto;
min-height: 0;
}
.pane-resizer {
background: #f7f7f7;
border-right: 1px solid var(--ol-border);
cursor: col-resize;
min-height: 0;
}
.pane-resizer:hover,
.pane-resizer.dragging { background: var(--ol-sel-bd); }
body.resizing { cursor: col-resize; user-select: none; }
.pane-tree { background: var(--ol-tree); }
.pane-target { border-right: 0; }
.pane-head {
@ -163,11 +172,7 @@ a.tree-node { display: block; color: inherit; text-decoration: none; }
@media (max-width: 1180px) {
.four-pane {
grid-template-columns: 200px 320px minmax(300px, 1fr);
}
.pane-target {
grid-column: 3;
border-top: 1px solid var(--ol-border);
grid-template-columns: 200px 6px 320px 6px minmax(280px, 1fr) 6px minmax(280px, 1fr);
}
}
@ -182,6 +187,7 @@ a.tree-node { display: block; color: inherit; text-decoration: none; }
border-right: 0;
border-bottom: 1px solid var(--ol-border);
}
.pane-resizer { display: none; }
.pane-target { grid-column: auto; }
.searchbar { top: 30px; }
}