perf(P6A.T2): respect prefers-reduced-motion globally + gate confetti
- Update globals.css reduced-motion block: 0.01ms → 0.001ms durations and add scroll-behavior: auto to suppress all transitions/animations when OS reduced-motion preference is active. - Gate canvas-confetti burst in GameModal behind matchMedia check so the particle effect is skipped entirely for users who opt out of motion. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -48,6 +48,14 @@ export function GameModal({ gameId, onClose }: Props) {
|
|||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (finished && winnerIdx !== null && winnerIdx === myPlayerIdx) {
|
if (finished && winnerIdx !== null && winnerIdx === myPlayerIdx) {
|
||||||
|
// Respect the OS-level reduced-motion preference.
|
||||||
|
if (
|
||||||
|
typeof window !== 'undefined' &&
|
||||||
|
window.matchMedia &&
|
||||||
|
window.matchMedia('(prefers-reduced-motion: reduce)').matches
|
||||||
|
) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
// Two bursts from the lower corners for a celebratory feel.
|
// Two bursts from the lower corners for a celebratory feel.
|
||||||
void confetti({
|
void confetti({
|
||||||
particleCount: 80,
|
particleCount: 80,
|
||||||
|
|||||||
@@ -85,9 +85,10 @@
|
|||||||
*,
|
*,
|
||||||
*::before,
|
*::before,
|
||||||
*::after {
|
*::after {
|
||||||
animation-duration: 0.01ms !important;
|
animation-duration: 0.001ms !important;
|
||||||
animation-iteration-count: 1 !important;
|
animation-iteration-count: 1 !important;
|
||||||
transition-duration: 0.01ms !important;
|
transition-duration: 0.001ms !important;
|
||||||
|
scroll-behavior: auto !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user