Skip to content

fix(web): honor reduced-motion preferences across product UI #4174

Description

@jeanduplessis

Problem

Shared and feature-specific animations use bounce, scale, layout-property transitions, perpetual pulse/ping/spin, and long choreography without prefers-reduced-motion behavior.

Remediation action

Add one consistent reduced-motion policy and apply it to all audited product motion.

Representative scope

  • apps/web/src/app/globals.css:423
  • apps/web/src/components/ui/sidebar.tsx:227
  • apps/web/src/components/HeaderLogo.tsx:33
  • apps/web/src/components/cloud-agent-next/TypingIndicator.tsx:12
  • apps/web/src/components/app-builder/AppBuilderChat.tsx:132
  • apps/web/src/components/code-reviews/CodeReviewStreamView.tsx:620
  • apps/web/src/app/(app)/claw/components/ProvisioningStep.tsx:193
  • apps/web/src/app/(app)/gastown/onboarding/OnboardingStepModel.tsx:27
  • apps/web/src/components/gastown/BeadBoard.tsx:227
  • apps/web/src/components/wasteland/WastelandSidebar.tsx:105

Acceptance criteria

  • Nonessential bounce, scale, glow, spring, stagger, pulse, ping, and spin stop under reduced motion.
  • Functional progress remains understandable through static text/icon state.
  • Product transitions target explicit transform/opacity/color properties, use canonical duration/easing, and avoid casual width/height/position animation.
  • Legacy glow values and button scaling are removed from global animation.
  • Automated or Storybook coverage demonstrates normal and reduced-motion states.

Metadata

Metadata

Assignees

No one assigned

    Labels

    P1Should fix before soft launchbugSomething isn't working

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions