The archetype tiles keep their own classes; only the comment in ArchetypePicker.css that named the old broadcast classes now names the picker's.
108 lines
2.1 KiB
CSS
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);
|
|
}
|