diff --git a/docs/superpowers/plans/2026-05-04-micro-fun-patch.md b/docs/superpowers/plans/2026-05-04-micro-fun-patch.md index 1712069..0d597c8 100644 --- a/docs/superpowers/plans/2026-05-04-micro-fun-patch.md +++ b/docs/superpowers/plans/2026-05-04-micro-fun-patch.md @@ -211,6 +211,7 @@ const ACTIVITY_EVENTS: Array = [ 'touchstart', 'keydown', 'scroll', + 'wheel', ]; export function useIdleMood(idleAfterMs: number = IDLE_AFTER_MS): Mood { @@ -262,9 +263,7 @@ const idleSpriteWrapperStyle = (mood: Mood) => css` display: inline-block; width: 100%; height: 100%; - ${mood === 'idle' - ? `animation: ${idleYawnKeyframes.toString()} 8s ease-in-out infinite;` - : ''} + animation: ${mood === 'idle' ? css`${idleYawnKeyframes} 8s ease-in-out infinite` : 'none'}; `; ``` diff --git a/src/components/screens/ElementsScreen.tsx b/src/components/screens/ElementsScreen.tsx index 4a392e6..5d7ee28 100644 --- a/src/components/screens/ElementsScreen.tsx +++ b/src/components/screens/ElementsScreen.tsx @@ -527,9 +527,7 @@ const idleSpriteWrapperStyle = (mood: Mood) => css` display: inline-block; width: 100%; height: 100%; - ${mood === 'idle' - ? `animation: ${idleYawnKeyframes.toString()} 8s ease-in-out infinite;` - : ''} + animation: ${mood === 'idle' ? css`${idleYawnKeyframes} 8s ease-in-out infinite` : 'none'}; `; const producerInfoStyle = css` diff --git a/src/lib/useIdleMood.ts b/src/lib/useIdleMood.ts index 3a35a25..f634e7d 100644 --- a/src/lib/useIdleMood.ts +++ b/src/lib/useIdleMood.ts @@ -10,6 +10,7 @@ const ACTIVITY_EVENTS: Array = [ 'touchstart', 'keydown', 'scroll', + 'wheel', ]; export function useIdleMood(idleAfterMs: number = IDLE_AFTER_MS): Mood {