fix(logs): log output scrolls internally instead of scrolling the page

Closes #2720 (partial — logs scroll fix).

Make body.logs-shell a full-viewport flex column so the visible .logs-pane
fills the remaining height and .journal-output (already flex:1 overflow:auto)
scrolls its content. Also handle the AUDIT tab's <div> output the same way.
The tab bar and toolbar stay anchored at the top; only the log text scrolls.
This commit is contained in:
iris 2026-07-26 17:20:48 +02:00
commit c8ed190ccc

View file

@ -5,6 +5,14 @@
body.logs-shell {
margin: 0;
padding: 0;
/* Full-viewport flex column so the log pane can scroll internally
instead of the whole page scrolling. The sticky-top wrapper and
page-header shrink to their natural height; .logs-main takes the
rest and each visible .logs-pane fills it. */
height: 100dvh;
display: flex;
flex-direction: column;
overflow: hidden;
}
/* Base tab styling now lives in @hive/shared/tabs.css (.hive-tab*). The
@ -18,10 +26,28 @@ body.logs-shell {
}
.logs-main {
padding: 1.2em 1.5em 2em;
padding: 1.2em 1.5em 0;
flex: 1 1 0;
min-height: 0;
display: flex;
flex-direction: column;
}
.logs-pane[hidden] { display: none; }
.logs-pane {
flex: 1 1 0;
min-height: 0;
display: flex;
flex-direction: column;
padding-bottom: 1.2em;
}
/* The AUDIT tab uses a <div> for its list instead of a <pre>, so give
it the same flex-grow + internal scroll that .journal-output already has. */
#audit-list {
flex: 1 1 0;
min-height: 0;
overflow-y: auto;
}
.logs-toolbar {
display: flex;