agentsclimarketplace

Reduced motion first terminal animation

Skill ychampion/cskill-agents/skills/reduced-motion-first-terminal-animation

Pause terminal animations when the user requests reduced motion, then resume cleanly without tearing the rest of the UI.From its SKILL.md

Install
npx -y skills add ychampion/cskill-agents --skill reduced-motion-first-terminal-animation

Assembled from the repository path, not quoted from the project. Check it against their README if it does not work.

SKILL.md

1.8 KB, 315 tokens by cl100k_base, as published. Nobody here has run it

SKILL: Reduced-Motion First Terminal Animation

Domain: terminal-ui Trigger: Build any animation that should stay dormant until the user explicitly opts into motion. Source Pattern: Distilled from reviewed terminal rendering, layout, animation, and accessibility implementations.

Core Method

Read the local reduced-motion preference before spawning timers and treat null as “paused.” Hook animations into a single clock that can unregister itself whenever the animation is hidden, so the loop never races multiple independent timers while respecting accessibility.

Key Rules

  • Evaluate get initial settings prefers reduced motion (or equivalent) on mount and refuse to start motion if true.
  • Share one clock (e.g., use animation frame) so every animation breathes in sync and can be paused by passing null.
  • Never queue set timeout when reduced motion or pause is active; return the last drawn frame instead.
  • Resume from the current global time when motion becomes allowed again so there is no jump.

Example Application

When animating a loading spinner in a toolbar, wire the spinner to the shared clock and keep it frozen until the user unsets prefers reduced motion; the rest of the layout retains its state, and the spinner returns to the proper frame without rewinding.

Anti-Patterns (What NOT to do)

  • Starting independent timers before checking reduced-motion and then canceling them later.
  • Letting each animated component manage its own clock, which prevents pausing all motion with a single flag.
  • Resetting animation timelines when motion resumes, which causes jarring jumps.

What ships with it: 1 file

849 B alongside SKILL.md

Keep looking

Skills are one crate of 325,949. Ordering is by how many stacks a row turns up in, so the top of any crate is what has actually been picked rather than what has the most stars.