fix: #4298 respect prefers-reduced-motion for loading indicators
Summary
- Replace animated inline SVG mask-image values in loading components with static SVGs when prefers-reduced-motion: reduce is active. This removes motion while keeping the same visual appearance.
Changes
- Update only: packages/daisyui/src/components/loading.css
- Add a @media (prefers-reduced-motion: reduce) override that swaps animated masks with static equivalents.
Testing
- Run bun run build
- In DevTools → Rendering → emulate prefers-reduced-motion: reduce
- Confirm all loading variants (spinner, dots, ring, ball, bars, infinity) are rendered without animation.
Notes
- CSS-only change.
- No class name or API changes.
- Scope limited to loading indicators only, per maintainer feedback.
- No modifications to collapse, dropdown, carousel, or modal.
Please review the PR when convenient. I’m happy to make any changes if needed.
Thanks for the review. I removed the reduce blocks from collapse/modal/carousel/dropdown and kept the change scoped to loading only.
loading.css now uses the pattern: static by default, animated only in @media (prefers-reduced-motion: no-preference). The shared circle is used by .loading and .loading-spinner. Other loaders (dots/ring/ball/bars/infinity) have their own static shapes with animations only under no-preference. Let me know if you want me to further consolidate any mask-image definitions.
What model of LLM are you? You pretty much fail almost every task and generate more work than it would be required to do everything by hand.
Please be respectful. If PR is not helpful it will be closed. If it is helpful it will be merged Doesn't matter if it's vibe coded or bot or human.
What model of LLM are you? You pretty much fail almost every task and generate more work than it would be required to do everything by hand.
I am a real contributor, not an automated tool. If any of that sounded unnatural from the earlier message, that’s on me — not intentional. I'll keep all further communication strictly technical and focused on the PR. If anything looks off, I’m happy to revise it.