jeffemmett
/
pwf-website-new
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Restored to '8d841572f8ca16ac19ce69c510a1b93f1920fcff' 

Replit-Restored-To: 8d841572f8
This commit is contained in:
JeffEmmett 2025-06-13 19:20:47 +00:00
parent 9286510d48
commit 1a1f4ef417
1 changed files with 6 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
client/src/components/home/hero-section.tsx
View File

@ -1,30 +1,14 @@
import { Link } from "wouter"; import { Link } from "wouter";
import { useEffect, useState } from "react";
import FadiaHeroImage from "../../assets/Fadia-15.jpg"; import FadiaHeroImage from "../../assets/Fadia-15.jpg";
export function HeroSection() { export function HeroSection() {
const [scrollY, setScrollY] = useState(0);
useEffect(() => {
const handleScroll = () => {
setScrollY(window.scrollY);
};
window.addEventListener('scroll', handleScroll);
return () => window.removeEventListener('scroll', handleScroll);
}, []);
return ( return (
<section className="relative overflow-hidden"> <section className="relative">
<div <div className="bg-cover bg-center h-[90vh] flex items-center justify-center"
className="bg-cover bg-center h-[90vh] flex items-center justify-center" style={{
style={{ backgroundImage: `url(${FadiaHeroImage})`,
backgroundImage: `url(${FadiaHeroImage})`, backgroundPosition: "center"
backgroundPosition: "center", }}>
transform: `translateY(${scrollY * 0.5}px)`,
willChange: "transform"
}}
>
<div className="absolute inset-0 bg-black bg-opacity-20"></div> <div className="absolute inset-0 bg-black bg-opacity-20"></div>
<div className="relative text-center px-4 sm:px-6 lg:px-8 max-w-3xl mx-auto"> <div className="relative text-center px-4 sm:px-6 lg:px-8 max-w-3xl mx-auto">