Let the AI card fill its row on the Monitor
The Assistant spans both rows and grid gives a spanning item's surplus to the tracks it spans, so at Large the card sat at the top of a row much taller than it needed.
This commit is contained in:
@@ -229,10 +229,8 @@ body.vv-fullscreen #displaybox { padding-left: 1rem !important; padding-top: .5r
|
||||
box the row had already sized.
|
||||
|
||||
align-items:start, not the stretch the grid above uses, so a card opts in to matching the
|
||||
Assistant rather than being dragged to its height. Conversations opts in below — a list next
|
||||
to a transcript reads better level, and it has rows to fill the space with. AI stays at its
|
||||
own height: its content is a handful of lines, and stretching it to 750px after an expand
|
||||
would buy a tidy bottom edge with a mostly empty panel. */
|
||||
Assistant rather than being dragged to its height. All three in this row opt in below; the
|
||||
default stays start so a card added later has to say so. */
|
||||
#vv-monitor-ai {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(8, 1fr);
|
||||
@@ -248,7 +246,11 @@ body.vv-fullscreen #displaybox { padding-left: 1rem !important; padding-top: .5r
|
||||
what it sets. This has to be written as row+column rather than the spans that were inline on
|
||||
the markup: a span says how wide, never which row, and auto-placement would drop Tokens into
|
||||
the first gap it found rather than under AI. */
|
||||
#vv-ai-stats-card { grid-column: 1 / span 1; grid-row: 1; }
|
||||
/* AI fills its own row rather than sitting at the top of it. The Assistant spans both rows, and
|
||||
grid hands a spanning item's surplus height to the tracks it spans — so at Large, row 1 grows
|
||||
well past what the AI card's few lines need and the card left a gap above Tokens. Stretching is
|
||||
a no-op at the smaller sizes, where there is no surplus to take. */
|
||||
#vv-ai-stats-card { grid-column: 1 / span 1; grid-row: 1; align-self: stretch; }
|
||||
#vv-ai-tokens-card { grid-column: 1 / span 1; grid-row: 2; }
|
||||
#vv-ai-chats-card { grid-column: 2 / span 2; grid-row: 1 / span 2; }
|
||||
#vv-ai-assistant-card { grid-column: 4 / span 5; grid-row: 1 / span 2; }
|
||||
|
||||
Reference in New Issue
Block a user