Let the Assistant's expand control actually give the transcript room
The AI cards sat in the monitor grid, which caps every row at a quarter of the viewport and clips the card, so expanding grew the transcript inside a box the row had already sized.
This commit is contained in:
@@ -215,6 +215,55 @@ body.vv-fullscreen #displaybox { padding-left: 1rem !important; padding-top: .5r
|
||||
#vv-monitor .vv-card > div { overflow-y: visible; min-height: auto; }
|
||||
}
|
||||
|
||||
/* ── Monitor: AI row ──────────────────────────────────────────────────────────
|
||||
Same eight columns and the same gap as #vv-monitor, and margin-top matches that grid's row
|
||||
gap, so the two containers read as one board. What differs is height, which is the whole
|
||||
reason it is a separate grid: no grid-auto-rows cap and no overflow:hidden on the cards, so
|
||||
the Assistant's expand control gives the transcript real room instead of growing it inside a
|
||||
box the row had already sized.
|
||||
|
||||
align-items:start, not the stretch the grid above uses. Expanding is a request to read one
|
||||
card; stretching its neighbours to 750px of mostly empty panel answers a question nobody
|
||||
asked. The cards sit at their own heights and the Assistant grows past them. */
|
||||
#vv-monitor-ai {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(8, 1fr);
|
||||
gap: 12px;
|
||||
margin-top: 12px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
/* Conversations scrolls on its own now. Inside #vv-monitor it inherited a cap from
|
||||
`.vv-card > div { flex:1; overflow-y:auto }` and never needed one of its own; out here the
|
||||
list is content-driven, and an install with forty saved chats would render forty rows. The
|
||||
cap matches the Assistant's resting transcript height so the row starts out level. */
|
||||
#vv-monitor-ai #vv-ai-chats-card > div {
|
||||
max-height: 300px;
|
||||
overflow-y: auto;
|
||||
-ms-overflow-style: none;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
#vv-monitor-ai #vv-ai-chats-card > div::-webkit-scrollbar { display: none; }
|
||||
|
||||
/* Medium width — 4 columns, mirroring #vv-monitor's own breakpoint. The 1/2/5 spans do not
|
||||
survive the narrower grid: 5 of 4 would silently overflow the track. */
|
||||
@media (max-width: 1024px) {
|
||||
#vv-monitor-ai { grid-template-columns: repeat(4, 1fr) !important; }
|
||||
#vv-ai-stats-card { grid-column: span 1 !important; }
|
||||
#vv-ai-chats-card { grid-column: span 3 !important; }
|
||||
#vv-ai-assistant-card { grid-column: span 4 !important; }
|
||||
}
|
||||
|
||||
/* Phone — single column, natural heights, page scrolls. The list cap goes too: on a page that
|
||||
already scrolls, a scroll region inside it is a trap for a thumb. */
|
||||
@media (max-width: 480px) {
|
||||
#vv-monitor-ai { grid-template-columns: 1fr !important; }
|
||||
#vv-monitor-ai > .vv-card { grid-column: 1 / -1 !important; }
|
||||
#vv-monitor-ai #vv-ai-chats-card > div { max-height: none; overflow-y: visible; }
|
||||
}
|
||||
|
||||
/* Monitor responsive — 4-column grid at medium width */
|
||||
@media (max-width: 1400px) {
|
||||
/* CPU core bars — reduce gap/min-width at intermediate widths before cores get clipped */
|
||||
|
||||
@@ -297,8 +297,19 @@ $_vv_doc_vars = array_merge(vv_conf_vars(), ['SCRIPTS_DIR' => SCRIPTS_DIR]);
|
||||
<div id="vv-array-body">Loading...</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<?php if (vv_ai_ui_on()): ?>
|
||||
<!-- Row 5: AI residency | Saved conversations | Assistant -->
|
||||
<!-- ── AI row — its own grid, deliberately ──────────────────────────────────────
|
||||
Same eight columns and the same gap, so it reads as the last row of the one above. It is a
|
||||
separate container because #vv-monitor caps every row at minmax(0, ~25vh) and clips its
|
||||
cards with overflow:hidden — which is right for a dashboard tile that must not push the
|
||||
others off screen, and wrong for the one card you sit and read. Inside that grid the
|
||||
expand control did nothing visible: the transcript grew and scrolled inside a box whose
|
||||
height the row had already decided.
|
||||
Cards here size to their content instead. -->
|
||||
<div id="vv-monitor-ai">
|
||||
<!-- AI residency | Saved conversations | Assistant -->
|
||||
<!-- Present only on the AI host with AI_ENABLED true, on the same footing as the GPU and UPS
|
||||
cards above: a subsystem that is not here does not render an empty card explaining that
|
||||
it is not here. api/ai.php refuses every action independently, so this is presentation
|
||||
@@ -349,9 +360,8 @@ $_vv_doc_vars = array_merge(vv_conf_vars(), ['SCRIPTS_DIR' => SCRIPTS_DIR]);
|
||||
]);
|
||||
?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<!-- ── How to read this page ────────────────────────────────────────────────────
|
||||
Rendered from pages/readme/monitor-readme.md, not maintained here. That file is also what
|
||||
|
||||
Reference in New Issue
Block a user