From e24c1c7be7cd0749bb50109bc576279ea560a20d Mon Sep 17 00:00:00 2001 From: belviskhoremk Date: Mon, 3 Aug 2026 23:02:21 +0000 Subject: [PATCH] fix: make Home's portrait parallax respect prefers-reduced-motion The About section's portrait image now checks useReducedMotion() and disables parallax scroll motion when the user has set OS-level reduced motion preferences. Claude-Session: https://claude.ai/code/session_01NhxA4npAXAxmCDEJt6kxSH --- src/pages/Home.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx index 5081960..159376d 100644 --- a/src/pages/Home.tsx +++ b/src/pages/Home.tsx @@ -1,5 +1,5 @@ import { Link, useNavigate } from 'react-router-dom' -import { motion, useScroll, useTransform } from 'framer-motion' +import { motion, useScroll, useTransform, useReducedMotion } from 'framer-motion' import Hero3DScene from '../components/Hero3DScene' import ScrollReveal from '../components/ScrollReveal' import ServiceCard from '../components/ServiceCard' @@ -17,7 +17,8 @@ const TESTIMONIALS = [ function Home() { const navigate = useNavigate() const { scrollYProgress } = useScroll() - const portraitY = useTransform(scrollYProgress, [0, 1], [0, -40]) + const prefersReducedMotion = useReducedMotion() + const portraitY = useTransform(scrollYProgress, [0, 1], prefersReducedMotion ? [0, 0] : [0, -40]) return (