feat(ui): enhance session status visual indicators

- Add glow effect to status dots (green/yellow/red)
- Add stopped status style for terminated sessions
- Add subtle pulsing glow animation for active session card

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
arkon
2026-01-18 22:44:52 +01:00
co-authored by Claude Opus 4.5
parent 8c3d150638
commit c0efba8fa3
+10 -3
View File
@@ -605,9 +605,10 @@ body {
border-radius: 50%;
}
.session-status-dot.idle { background: var(--green); }
.session-status-dot.busy { background: var(--yellow); animation: pulse 1.5s infinite; }
.session-status-dot.error { background: var(--red); }
.session-status-dot.idle { background: var(--green); box-shadow: 0 0 6px var(--green); }
.session-status-dot.busy { background: var(--yellow); box-shadow: 0 0 8px var(--yellow); animation: pulse 1.5s infinite; }
.session-status-dot.error { background: var(--red); box-shadow: 0 0 6px var(--red); }
.session-status-dot.stopped { background: var(--text-muted); }
@keyframes pulse {
0%, 100% { opacity: 1; }
@@ -681,6 +682,12 @@ body {
.session-card.active {
border-color: var(--accent);
box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.3), 0 4px 12px rgba(59, 130, 246, 0.15);
animation: activeGlow 2s ease-in-out infinite;
}
@keyframes activeGlow {
0%, 100% { box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.3), 0 4px 12px rgba(59, 130, 246, 0.15); }
50% { box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.4), 0 4px 16px rgba(59, 130, 246, 0.25); }
}
.session-card:hover {