hive-agent: the per-agent page has no message box; its send route and the broker's operator message are removed
The page's composer (its input, slash commands and completion), POST /send in hive-agent, the OperatorMsg request of the agent socket and its handler in hive-c0re, and the broker-error helper only the send route used are deleted: writing to an agent is the swarm UI's terminal. cancel turn, new session and log out stay in the state badge's menu; POST /api/compact stays, with nothing on the page calling it. The request-line limit keeps its size, and its comment says it is a generous bound now. The docs describe the actions in place of the footer and the prompt.
This commit is contained in:
parent
e149ff3315
commit
23f4f1823b
1 changed files with 77 additions and 505 deletions
|
|
@ -16,7 +16,7 @@
|
|||
|
||||
/* ─── full-screen layout overrides ─────────────────────────────────
|
||||
The agent page mounts a full-viewport terminal under a fixed
|
||||
frosted-glass header + composer pair. See docs/web-ui/agent.md::Per-agent
|
||||
frosted-glass header. See docs/web-ui/agent.md::Per-agent
|
||||
page for the layer / pill / side-panel structure; rules below
|
||||
override the in-page defaults from @hive/shared. */
|
||||
|
||||
|
|
@ -25,13 +25,12 @@
|
|||
padding) alongside the two-row main column (title + nav-links
|
||||
on top, state strip below). */
|
||||
--agent-header-h: 6em;
|
||||
--agent-composer-h: 3.6em;
|
||||
--agent-frost-bg: color-mix(in srgb, var(--bg) 72%, transparent);
|
||||
--agent-frost-blur: blur(12px) saturate(140%);
|
||||
}
|
||||
|
||||
/* `?hide=header,input` (per-agent-page embed mode): `Root.tsx` toggles
|
||||
these body classes when it omits `<Header>`/the composer footer.
|
||||
/* `?hide=header` (per-agent-page embed mode): `Root.tsx` toggles
|
||||
this body class when it omits `<Header>`.
|
||||
Zeroing the custom properties here — rather than overriding each
|
||||
dependent rule — collapses every calc() that reads them (overlay
|
||||
offset, terminal scroll padding) in one place. */
|
||||
|
|
@ -39,9 +38,6 @@ body.agent-hide-header {
|
|||
--agent-header-h: 0px;
|
||||
--agent-header-real-h: 0px;
|
||||
}
|
||||
body.agent-hide-input {
|
||||
--agent-composer-h: 0px;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
|
|
@ -266,30 +262,6 @@ h3 {
|
|||
box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
|
||||
.agent-composer {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 30;
|
||||
min-height: var(--agent-composer-h);
|
||||
background: var(--agent-frost-bg);
|
||||
-webkit-backdrop-filter: var(--agent-frost-blur);
|
||||
backdrop-filter: var(--agent-frost-blur);
|
||||
border-top: 1px solid var(--purple-dim);
|
||||
box-shadow: 0 -6px 18px rgba(0, 0, 0, 0.35);
|
||||
}
|
||||
.agent-composer .term-input {
|
||||
/* The composer is its own chrome now — drop the in-terminal-wrap
|
||||
padding the legacy layout assumed. */
|
||||
padding: 0.45em 1em;
|
||||
}
|
||||
.agent-composer .term-input .sendform-term {
|
||||
/* No dashed top-border in the floating composer — the box-shadow
|
||||
and frosted border already separate it from the terminal. */
|
||||
border-top: 0;
|
||||
padding-top: 0;
|
||||
}
|
||||
.meta {
|
||||
color: var(--muted);
|
||||
font-size: 0.85em;
|
||||
|
|
@ -618,9 +590,8 @@ pre.diff {
|
|||
(StatusChips.tsx's `StatusMenu`, `@hive/shared`'s
|
||||
`.ui-dropdown-item-danger`). */
|
||||
/* Orphaned tombstone — `.btn-new-session` round-pill moved into the
|
||||
overflow menu, then out of the header entirely: it's the
|
||||
`/new-session` slash command now (TermInput.tsx), no button/chip
|
||||
left to style. */
|
||||
overflow menu, then out of the header entirely: it's a row of the
|
||||
state badge's menu now, no button/chip left to style. */
|
||||
/* Markup carries `hive-pill` alongside `state-badge` (shared pill.css
|
||||
supplies the shape); this rule is only the transition + state-
|
||||
specific colour below. */
|
||||
|
|
@ -681,8 +652,8 @@ pre.diff {
|
|||
black frame for the in-page case; the agent page now owns the
|
||||
whole viewport so the frame chrome would be redundant noise.
|
||||
`.live.terminal` similarly drops the in-page max-height cap so
|
||||
it can fill the main area top-to-bottom; the floating header +
|
||||
composer overlay it via fixed positioning. */
|
||||
it can fill the main area top-to-bottom; the floating header
|
||||
overlays it via fixed positioning. */
|
||||
.agent-main .terminal-wrap {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
|
|
@ -698,94 +669,28 @@ pre.diff {
|
|||
inset: 0;
|
||||
height: auto;
|
||||
max-height: none;
|
||||
/* Scroll behind the floating header/composer, but keep the first
|
||||
/* Scroll behind the floating header, but keep the first
|
||||
and last rows reachable with extra padding inside the scroll
|
||||
area. scroll-padding-* keeps anchor-jumps (the `↓ N new` pill,
|
||||
focus restore) clear of the floats too. */
|
||||
padding-top: calc(var(--agent-header-real-h, var(--agent-header-h)) + 0.8em);
|
||||
padding-bottom: calc(var(--agent-composer-h) + 0.8em);
|
||||
padding-bottom: 0.8em;
|
||||
scroll-padding-top: calc(
|
||||
var(--agent-header-real-h, var(--agent-header-h)) + 0.8em
|
||||
);
|
||||
scroll-padding-bottom: calc(var(--agent-composer-h) + 0.8em);
|
||||
scroll-padding-bottom: 0.8em;
|
||||
overflow: auto;
|
||||
}
|
||||
/* Tail pill (↓ N new): nudged up so it floats clear of the composer
|
||||
rather than colliding with the frosted bar. z-index bumped above
|
||||
the composer (z-30) so the pill sits on the top layer instead of
|
||||
being clipped by the floating chrome. (Pill is anchored in
|
||||
/* Tail pill (↓ N new): z-index bumped above the floating chrome so the
|
||||
pill sits on the top layer instead of being clipped by it. (Pill is anchored in
|
||||
`.agent-main` rather than `.terminal-wrap` — see
|
||||
docs/web-ui/agent.md::Per-agent page Terminal-wrap paragraph for the
|
||||
backdrop-filter stacking-context rationale.) */
|
||||
.agent-main .tail-pill {
|
||||
bottom: calc(var(--agent-composer-h) + 0.6em);
|
||||
bottom: 0.6em;
|
||||
z-index: 35;
|
||||
}
|
||||
|
||||
/* Composer chrome lives inside the fixed `.agent-composer` defined
|
||||
further up. The base rules below stay scoped to whichever ancestor
|
||||
owns it. */
|
||||
.term-input .sendform-term {
|
||||
display: flex;
|
||||
/* mara, live: "bottom input row text not aligned / inconsistent
|
||||
sizes." Real cause: `.prompt` (1em, no line-height override) and
|
||||
`.submit-hint` (0.8em, no line-height override) each get a
|
||||
browser-default line-box at a different em-relative size, so
|
||||
`align-items: flex-start` (their old value) pinned each one's
|
||||
line-box top edge to the row's top — same nominal `padding-top`
|
||||
but a DIFFERENT absolute offset per element, since 0.25em means
|
||||
something different at 1em vs 0.8em font-size. `center` sidesteps
|
||||
the whole "line-box for text this size" mismatch by aligning each
|
||||
item's own box middle instead of a top edge that was never
|
||||
actually equal. Still correct once the textarea grows multi-line
|
||||
(a common composer-bar convention — Slack/Discord centre their
|
||||
send affordance against a grown box too, not pin it to the first
|
||||
line). */
|
||||
align-items: center;
|
||||
gap: 0.5em;
|
||||
/* The dashed in-frame separator is dropped — see the
|
||||
.agent-composer .term-input override above for the floating-bar
|
||||
variant. */
|
||||
border-top: 1px dashed var(--purple-dim);
|
||||
padding-top: 0.5em;
|
||||
}
|
||||
.term-input .prompt {
|
||||
color: var(--green);
|
||||
text-shadow: 0 0 6px color-mix(in srgb, var(--green) 60%, transparent);
|
||||
user-select: none;
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
.term-input textarea {
|
||||
flex: 1;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
outline: 0;
|
||||
color: var(--fg);
|
||||
font-family: inherit;
|
||||
font-size: 1em;
|
||||
padding: 0.2em 0;
|
||||
caret-color: var(--green);
|
||||
resize: none;
|
||||
overflow-y: auto;
|
||||
line-height: 1.4;
|
||||
min-height: 1.4em;
|
||||
}
|
||||
.term-input textarea::placeholder {
|
||||
color: var(--muted);
|
||||
}
|
||||
.term-input .submit-hint {
|
||||
color: var(--muted);
|
||||
font-size: 0.8em;
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
.term-input.disabled .prompt {
|
||||
color: var(--muted);
|
||||
text-shadow: none;
|
||||
}
|
||||
.term-input.disabled textarea {
|
||||
color: var(--muted);
|
||||
}
|
||||
|
||||
/* ─── side panel (singleton drawer) ────────────────────────────────
|
||||
Inbox + loose-ends details open here instead of expanding inline. The
|
||||
drawer chrome itself (backdrop, drawer, resize handle, header, title,
|
||||
|
|
|
|||
Loading…
Reference in a new issue