Watch
0
0
Fork
You've already forked hyperhive
0
hyperhive/frontend/packages/swarm-ui/src/pages/broadcast/BroadcastComposer.css
iris bb735d2e35 swarm-ui: the broadcast's loading skeleton uses the shared picker's class names
The archetype tiles keep their own classes; only the comment in
ArchetypePicker.css that named the old broadcast classes now names the
picker's.
2026-11-12 00:34:22 +01:00

108 lines
2.1 KiB
CSS

/* <BroadcastComposer>: the agent picker over the message box, then the per-agent
result. One column; the grid wraps to however many icons fit. */
.ui-broadcast {
display: flex;
flex-direction: column;
gap: 1em;
}
.ui-broadcast-bar {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.5em 1em;
}
/* Same segmented pair as the agents page's view switcher. */
.ui-broadcast-filter {
display: inline-flex;
border: 1px solid var(--border);
border-radius: 0.4em;
overflow: hidden;
}
.ui-broadcast-filter button {
border: none;
background: none;
color: var(--muted);
padding: 0.45em 0.75em;
font: inherit;
font-size: 0.9em;
cursor: pointer;
}
.ui-broadcast-filter button + button {
border-left: 1px solid var(--border);
}
.ui-broadcast-filter button.active {
background: var(--bg-elev);
color: var(--fg);
}
.ui-broadcast-filter button:not(.active):hover {
color: var(--fg);
}
.ui-broadcast-link {
border: none;
background: none;
padding: 0.2em 0;
color: var(--blue);
font: inherit;
font-size: 0.9em;
cursor: pointer;
text-decoration: underline;
}
.ui-broadcast-link:disabled {
color: var(--muted);
text-decoration: none;
cursor: default;
}
.ui-broadcast-count {
margin-left: auto;
font-size: 0.9em;
}
.ui-broadcast-send {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 0.75em;
}
.ui-broadcast-cap {
color: var(--red);
font-size: 0.9em;
}
/* What came back, one line per agent. */
.ui-broadcast-result {
margin-top: 1em;
}
.ui-broadcast-summary {
display: flex;
flex-wrap: wrap;
align-items: baseline;
gap: 0.5em 1em;
margin: 0 0 0.5em;
}
.ui-broadcast-outcomes {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 0.35em;
}
.ui-broadcast-outcomes li {
display: flex;
align-items: center;
gap: 0.6em;
}
.ui-broadcast-outcome-name {
font-weight: 600;
}
.ui-broadcast-ok {
color: var(--green);
}
.ui-broadcast-fail {
color: var(--red);
}
.ui-broadcast-ok .ui-broadcast-outcome-name,
.ui-broadcast-fail .ui-broadcast-outcome-name {
color: var(--fg);
}