ix(ai-chat): keep typing dots bouncing under reduced-motion
The "Thinking…" indicator's bounce was fully disabled by the prefers-reduced-motion rule (animation: none), leaving the dots frozen for users with "Reduce motion" enabled. Drive the bounce height with a --bounce custom property: -6px by default and a smaller -3px under reduced-motion, so the indicator stays visibly active everywhere instead of freezing.
This commit is contained in:
@@ -88,16 +88,18 @@
|
||||
opacity: 0.4;
|
||||
}
|
||||
40% {
|
||||
transform: translateY(-3px);
|
||||
/* Bounce height is driven by --bounce so reduced-motion can dampen it
|
||||
(below) without disabling the animation outright. */
|
||||
transform: translateY(var(--bounce, -6px));
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/* Respect reduced-motion preferences: fall back to a static dimmed state. */
|
||||
/* Respect reduced-motion preferences: keep a smaller bounce instead of a full
|
||||
stop, so the "thinking" indicator still reads as active rather than frozen. */
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.typingDots span {
|
||||
animation: none;
|
||||
opacity: 0.6;
|
||||
--bounce: -3px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user