Watch
0
0
Fork
You've already forked hyperhive
0

swarm-ui: terminal tab fills the viewport below the header

The agent terminal tab now takes the whole window except the header bar,
full width and height, instead of sitting in the padded content column.
The connection badge floats inside the terminal's top-left corner and the
toolbar row above it is gone on this route.
This commit is contained in:
iris 2026-10-04 15:52:24 +02:00 • committed by mara
commit 66df552f68
5 changed files with 87 additions and 51 deletions

View file

@ -1,26 +1,13 @@
/* <AgentTerminalPage> — gives `AgentTermPreview`'s `fullHeight` flex
chain (`.ui-agent-term-preview-full`, AgentTermPreview.css) something
real to fill. `Shell.css`'s `.shell-body` has no fixed height of its
own (it's a plain flow column sized by content), so without an
explicit height here the chain's `flex: 1` would resolve against
nothing and the terminal would collapse to its content's own height
instead of filling the viewport — the opposite of what "full-height"
mount means for this page specifically (the 12em-capped preview
inside `AgentsPage` deliberately has no such wrapper; this is the one
place that needs it).
`100dvh`, not `100vh` — `100vh` on a mobile browser includes the
address-bar chrome even while it's visibly on-screen, so the terminal
would render taller than the actually-visible viewport there;
`100dvh` tracks the real visible area instead. The subtraction below
is a fixed estimate (Shell.css's own `.shell-header` padding +
`.shell-body`'s), not a measured value — an exact fit isn't worth a
ResizeObserver for a single full-bleed page; a few pixels short of
the viewport edge reads as intentional breathing room, not a bug. */
/* <AgentTerminalPage> — fills `.shell-body-full` (Shell.css), which is
already everything below the header bar, full width and height. This
wrapper only has to pass that height down so `AgentTermPreview`'s
`fullHeight` flex chain (`.ui-agent-term-preview-full`) has a real box
to fill. */
.ui-agent-terminal-page {
flex: 1;
min-height: 0;
display: flex;
flex-direction: column;
height: calc(100dvh - 4.5em - 3em);
}
.ui-agent-terminal-page .ui-agent-term-preview-full {