agents-orchestrator/agent-orchestrator
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

perf(ui-dioxus): 6-step color fade without CSS transition engine (~0% CPU)

Browse source
This commit is contained in:
Hibryda 2026-03-19 07:28:38 +01:00
parent 8b5a4daf72
commit 3e6307ffd0
2 changed files with 36 additions and 26 deletions
Download patch file Download diff file Expand all files Collapse all files

27
ui-dioxus/src/theme.rs
View file

@ -282,17 +282,22 @@ body {{
background: var(--ctp-red);
box-shadow: 0 0 4px var(--ctp-red);
}}
/* PulsingDot: smooth pulse via background-color transition (bounded, not infinite) */
.pulsing-dot {{
display: inline-block;
border-radius: 50%;
flex-shrink: 0;
transition: background-color 0.4s ease;
}}
.dot-bright.dot-running {{ background: var(--ctp-green); box-shadow: 0 0 6px var(--ctp-green); }}
.dot-dim.dot-running {{ background: var(--ctp-surface2); box-shadow: none; }}
.dot-bright.dot-stalled {{ background: var(--ctp-peach); box-shadow: 0 0 4px var(--ctp-peach); }}
.dot-dim.dot-stalled {{ background: var(--ctp-surface2); box-shadow: none; }}
/* PulsingDot: 6-step color fade, no CSS transition (zero animation engine overhead) */
.pulsing-dot {{ display: inline-block; border-radius: 50%; flex-shrink: 0; }}
/* Running: green (#a6e3a1) → surface2 (#585b70) in 6 steps */
.dot-running.dot-s0 {{ background: #a6e3a1; box-shadow: 0 0 6px #a6e3a1; }}
.dot-running.dot-s1 {{ background: #8ec094; box-shadow: 0 0 3px #8ec094; }}
.dot-running.dot-s2 {{ background: #769d87; box-shadow: none; }}
.dot-running.dot-s3 {{ background: #6a8a7c; box-shadow: none; }}
.dot-running.dot-s4 {{ background: #769d87; box-shadow: none; }}
.dot-running.dot-s5 {{ background: #8ec094; box-shadow: 0 0 3px #8ec094; }}
/* Stalled: peach (#fab387) → surface2 in 6 steps */
.dot-stalled.dot-s0 {{ background: #fab387; box-shadow: 0 0 4px #fab387; }}
.dot-stalled.dot-s1 {{ background: #d9a07c; box-shadow: none; }}
.dot-stalled.dot-s2 {{ background: #b88d71; box-shadow: none; }}
.dot-stalled.dot-s3 {{ background: #a88068; box-shadow: none; }}
.dot-stalled.dot-s4 {{ background: #b88d71; box-shadow: none; }}
.dot-stalled.dot-s5 {{ background: #d9a07c; box-shadow: none; }}
.status-dot.error {{
background: var(--ctp-red);
}}