Yif
484e0f70cc
- StateDot ongoing: gradient spin ring replaced by an 8-cell pixel chase (2px matrix cells, stepped trail, no tweening) - Chat: streaming pulse block replaced by a turn-level 4-pixel chase at the flow tail — rides the whole running turn (first-token wait, tools, streaming) instead of flickering with partial presence - Tool rows (ToolRow/BashRow): running no longer swaps the icon for a dot; an animated mask band sweeps the row content, gliding off on exit via mask-position transition - Composer: send/stop unified on the blue fill (bigger stop glyph, static white arrow), textarea box-sizing overflow fix, settling phase hides the composer while replay decides hero vs docked, workspace-placeholder fallback disables the bar - Hero: glow moved behind (z-index) with lower opacity; tool-row hover icon crossfade at 100ms
66 lines
1.5 KiB
CSS
66 lines
1.5 KiB
CSS
/* Ongoing blue has no alias token (state-business-primary is the 500 step,
|
|
* not this 450) — component-level var pinned to the static scale instead. */
|
|
.dot,
|
|
.matrix {
|
|
--dsh-state-ongoing: var(--dsw-static-deepseek-450);
|
|
}
|
|
|
|
/* Solid states: same-color halo via a 0.10-opacity outer layer (::before)
|
|
* with a 6/10-scale solid core. Layer color rides currentColor set per state. */
|
|
.dot {
|
|
position: relative;
|
|
display: inline-block;
|
|
flex: none;
|
|
}
|
|
|
|
.dot::before {
|
|
content: '';
|
|
position: absolute;
|
|
inset: 0;
|
|
border-radius: 50%;
|
|
background: currentColor;
|
|
opacity: 0.1;
|
|
}
|
|
|
|
.dot::after {
|
|
content: '';
|
|
position: absolute;
|
|
inset: 20%;
|
|
border-radius: 50%;
|
|
background: currentColor;
|
|
}
|
|
|
|
.dot[data-state='done'] {
|
|
color: var(--dsw-alias-state-success-primary);
|
|
}
|
|
|
|
.dot[data-state='warning'] {
|
|
color: var(--dsw-alias-state-warn-primary);
|
|
}
|
|
|
|
.dot[data-state='error'] {
|
|
color: var(--dsw-alias-state-error-primary);
|
|
}
|
|
|
|
/* Pixel chase: each outer cell holds a discrete brightness step (flat keyframe
|
|
* holds, no tweening — the retro feel), peaking when the chase hits it and
|
|
* decaying over the next three cells. Phase offsets come from per-rect
|
|
* animation-delay (index * -125ms) set inline by the component. */
|
|
.matrix {
|
|
flex: none;
|
|
color: var(--dsh-state-ongoing);
|
|
}
|
|
|
|
.cell {
|
|
fill: currentColor;
|
|
opacity: 0.15;
|
|
animation: dsh-state-dot-chase 1s infinite;
|
|
}
|
|
|
|
@keyframes dsh-state-dot-chase {
|
|
0%, 12.4% { opacity: 1; }
|
|
12.5%, 24.9% { opacity: 0.6; }
|
|
25%, 37.4% { opacity: 0.35; }
|
|
37.5%, 100% { opacity: 0.15; }
|
|
}
|