Spaces:
Sleeping
Sleeping
Aissugur Kurganbekov
Claude Opus 4.8 (1M context)
Redesign landing into a cinematic "Proof Engine" experience
2695640 | import { useEffect } from "react"; | |
| // Reveal `.reveal` elements as they scroll into view (one shared observer). | |
| // Respects prefers-reduced-motion by showing everything immediately. | |
| export function useScrollReveal(deps = []) { | |
| useEffect(() => { | |
| const els = Array.from(document.querySelectorAll(".reveal")); | |
| if ( | |
| typeof window === "undefined" || | |
| window.matchMedia("(prefers-reduced-motion: reduce)").matches || | |
| !("IntersectionObserver" in window) | |
| ) { | |
| els.forEach((el) => el.classList.add("in")); | |
| return; | |
| } | |
| const io = new IntersectionObserver( | |
| (entries) => { | |
| entries.forEach((e) => { | |
| if (e.isIntersecting) { | |
| e.target.classList.add("in"); | |
| io.unobserve(e.target); | |
| } | |
| }); | |
| }, | |
| { threshold: 0.15, rootMargin: "0px 0px -10% 0px" } | |
| ); | |
| els.forEach((el, i) => { | |
| el.style.transitionDelay = `${Math.min(i * 60, 240)}ms`; | |
| io.observe(el); | |
| }); | |
| return () => io.disconnect(); | |
| // eslint-disable-next-line react-hooks/exhaustive-deps | |
| }, deps); | |
| } | |