theme: exempt status-indicator animations from anim-speed override

Cursor blink, card-bar-pulse, sync spinner and the chat unread blink all
have deliberate cadences — letting body.anim-fast/anim-slow speed them up
turns them into unreadable strobes (or the sync icon spinning at 100ms).
Higher-specificity rules pin each one to its natural duration via
!important.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
thandClaude Opus 4.6 committed 2026-04-11 18:48:54 +02:00
1 parent f886ded054
commit 2aec2d8f44
2 files changed
+30

No files matched your search

+23
View File
@@ -107,6 +107,29 @@ body.anim-slow *, body.anim-slow *::before, body.anim-slow *::after {
transition-duration: 400ms !important;
animation-duration: 600ms !important;
}
/* Blink / pulse animations are status indicators with deliberate cadences
(cursor, overdue bar, unread chat button, new collab bucket 3-pulse).
Speeding them up makes them useless strobes, so they ignore the global
anim-* override via higher-specificity rules. */
body.anim-fast .cursor-blink::after,
body.anim-slow .cursor-blink::after {
animation: blink 1s step-end infinite !important;
animation-duration: 1s !important;
}
body.anim-fast .card-bar-pulse,
body.anim-slow .card-bar-pulse {
animation: pulse-glow 2s ease-in-out infinite !important;
animation-duration: 2s !important;
}
body.anim-fast .board-card:has(.card-bar-pulse) .card-bar-pulse ~ * .text-t-danger,
body.anim-slow .board-card:has(.card-bar-pulse) .card-bar-pulse ~ * .text-t-danger {
animation-duration: 2s !important;
}
body.anim-fast .card-spinner,
body.anim-slow .card-spinner {
animation: spin 0.8s linear infinite !important;
animation-duration: 0.8s !important;
}
/* ── Theme preview (settings) ── */
.theme-preview {
+7
View File
@@ -332,3 +332,10 @@
#chat-footer-btn.blinking {
animation: chatBlink 1.2s ease-in-out infinite;
}
/* Ignore the global anim-speed override — the unread blink has a
deliberate cadence that becomes an unreadable strobe when sped up. */
body.anim-fast #chat-footer-btn.blinking,
body.anim-slow #chat-footer-btn.blinking {
animation: chatBlink 1.2s ease-in-out infinite !important;
animation-duration: 1.2s !important;
}