Across the app, hover/theme transitions are applied unconditionally with no
prefers-reduced-motion guard anywhere in src/app/globals.css or the Tailwind
utility classes used throughout the components:
/* globals.css */
body {
transition: background-color 0.2s ease, color 0.2s ease;
}
// BountyCard.tsx
className="... transition-all ... hover:-translate-y-0.5 hover:shadow-md ..."
// Navbar.tsx's "Dashboards" dropdown
className="... transition-all group-hover:visible group-hover:opacity-100"
None of these are wrapped in, or overridden by, a @media (prefers-reduced-motion: reduce)
block. A visitor who has explicitly set their OS/browser preference to reduce motion
(a real, common accessibility accommodation for vestibular disorders and motion
sensitivity) still gets every hover-lift animation on every bounty card, every theme
transition, and every dropdown fade, exactly as if no such preference were set —
globals.css never queries it at all.
Suggested fix: add a @media (prefers-reduced-motion: reduce) block in globals.css
that disables/shortens transitions and transforms globally (e.g. forcing
transition-duration: 0.01ms !important on *), so users who've opted out of motion at
the OS level actually get a reduced-motion experience.
Across the app, hover/theme transitions are applied unconditionally with no
prefers-reduced-motionguard anywhere insrc/app/globals.cssor the Tailwindutility classes used throughout the components:
None of these are wrapped in, or overridden by, a
@media (prefers-reduced-motion: reduce)block. A visitor who has explicitly set their OS/browser preference to reduce motion
(a real, common accessibility accommodation for vestibular disorders and motion
sensitivity) still gets every hover-lift animation on every bounty card, every theme
transition, and every dropdown fade, exactly as if no such preference were set —
globals.cssnever queries it at all.Suggested fix: add a
@media (prefers-reduced-motion: reduce)block inglobals.cssthat disables/shortens transitions and transforms globally (e.g. forcing
transition-duration: 0.01ms !importanton*), so users who've opted out of motion atthe OS level actually get a reduced-motion experience.