Monitor: cap the System card's Varaverk block so the host figures set the card's height, not the sum of both
This commit is contained in:
@@ -235,6 +235,29 @@ body.vv-fullscreen #displaybox { padding-left: 1rem !important; padding-top: .5r
|
||||
/* Hide scrollbars on any nested scrollable div inside monitor cards */
|
||||
#vv-monitor .vv-card div::-webkit-scrollbar { display: none; }
|
||||
|
||||
/* System card: the Varaverk half is bounded, the host half is not.
|
||||
This card is the one with no <h3>, so the header/body split that gives every other card a
|
||||
fixed part and a scrolling part had to be made inside its body. The cut is after Version:
|
||||
hostname, clock, model, array state, uptime, load and version are what the card is for and
|
||||
are left to size themselves, and only the block below them is capped.
|
||||
|
||||
A plain max-height, not flex:1 on the capped half. Under flex the strip is sized by what the
|
||||
block above leaves over, and on a 1080p row (177px against a ~190px host half) that remainder
|
||||
is negative: the strip collapses to nothing and the Varaverk figures vanish with no scrollbar
|
||||
to say so. A fixed cap cannot do that — the block is 64px wherever it lands, and where the card
|
||||
is shorter than the two halves together the body's own scroll (inherited above) reaches the rest.
|
||||
|
||||
64px is the label and about three rows of the Varaverk grid, so Cache, Data and Jobs read
|
||||
without scrolling. It also holds the card to ~254px, which is what stops it dragging its row
|
||||
down below eight columns, where rows are sized to content (see vv_mon_rung_overflows). */
|
||||
#vv-system-body .vv-sys-scroll {
|
||||
max-height: 64px;
|
||||
overflow-y: auto;
|
||||
-ms-overflow-style: none;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
#vv-system-body .vv-sys-scroll::-webkit-scrollbar { display: none; }
|
||||
|
||||
/* Dynamic row heights capped per screen tier — rows size to content, never exceed the cap.
|
||||
minmax(0, Xpx): track is content-driven but capped; align-items:stretch makes all cards
|
||||
in a row fill the track, so short cards (Pools, Watchdog) match tall ones (Array).
|
||||
|
||||
@@ -1079,9 +1079,10 @@ function vvPollMonitor(live) {
|
||||
<span style="color:#444;">Running</span> <span style="color:#888;">${_runningCtrs} ctr${_runningCtrs !== 1 ? 's' : ''}${_runningVMs > 0 ? ` · ${_runningVMs} VM` : ''}</span>
|
||||
<span style="color:#444;">Version</span> <span style="color:#3a3a3a;">${ver}</span>
|
||||
</div>
|
||||
|
||||
<!-- Varaverk's own figures, ruled off from the host's. Same grid so the labels line up,
|
||||
separate block so it reads as a different subject rather than more of the same. -->
|
||||
<div style="border-top:1px solid #1e1e1e;margin-top:8px;padding-top:7px;">
|
||||
<div class="vv-sys-scroll" style="border-top:1px solid #1e1e1e;margin-top:8px;padding-top:7px;">
|
||||
<div style="font-size:9px;color:#333;text-transform:uppercase;letter-spacing:.07em;margin-bottom:5px;">Varaverk</div>
|
||||
<div style="display:grid;grid-template-columns:auto 1fr;gap:3px 8px;font-size:11px;">
|
||||
<span style="color:#444;">Cache</span> <span style="color:${_cacheColor};">${_cacheStr}</span>
|
||||
|
||||
Reference in New Issue
Block a user