Sascha/Aime
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

GUI: Splitter zwischen Liste und Detail (340-680px, persistent)

Browse Source 
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_0113vDKdSNtD3Dwcw4QMu9yV
This commit is contained in:
schakal00783
2026-07-17 02:00:03 +02:00
co-authored by Claude Fable 5
parent f7c50b2b6b
commit 2c9015dd7c
3 changed files with 37 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/web/src/style.css
+9 -2
View File
@@ -175,7 +175,13 @@ audio { width: 100%; margin-bottom: 10px; }
.ana-line { margin: 2px 0 8px; }
/* ---- Aufnahmen: Liste links, Detail rechts ---- */
.rec-layout { display: flex; gap: 14px; align-items: flex-start; }
.rec-layout { display: flex; gap: 8px; align-items: flex-start; }
.rec-splitter {
flex: 0 0 6px; align-self: stretch; cursor: col-resize; border-radius: 3px;
background: transparent; transition: background .12s;
}
.rec-splitter:hover, body.resizing .rec-splitter { background: var(--accent-soft); }
body.resizing { cursor: col-resize; user-select: none; }
.rec-list-pane {
flex: 0 0 340px; position: sticky; top: 12px; max-height: calc(100vh - 90px);
overflow-y: auto; background: var(--surface); border: 1px solid var(--line);
@@ -268,7 +274,8 @@ audio { width: 100%; margin-bottom: 10px; }
@media (max-width: 800px) {
#app.wide { max-width: 860px; }
.rec-layout { flex-direction: column; }
.rec-list-pane { flex: none; width: 100%; position: static; max-height: 340px; }
.rec-list-pane { flex: none !important; width: 100%; position: static; max-height: 340px; }
.rec-splitter { display: none; }
.topbar nav { margin-left: 0; width: 100%; order: 3; }
}