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:
parent
aedfd512c6
commit
c8ed190ccc
1 changed files with 27 additions and 1 deletions
|
|
@ -5,6 +5,14 @@
|
||||||
body.logs-shell {
|
body.logs-shell {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 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
|
/* Base tab styling now lives in @hive/shared/tabs.css (.hive-tab*). The
|
||||||
|
|
@ -18,10 +26,28 @@ body.logs-shell {
|
||||||
}
|
}
|
||||||
|
|
||||||
.logs-main {
|
.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[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 {
|
.logs-toolbar {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue