jaecoo-kelapagading/components/landing-page/promo.tsx

31 lines
843 B
TypeScript

"use client";
import Image from "next/image";
import { motion } from "framer-motion";
export default function HeaderPromo() {
return (
<>
<section className="py-10 px-4 sm:px-6 md:px-10 bg-white">
<motion.div
initial={{ opacity: 0, y: 50 }}
animate={{ opacity: 1, y: 0 }}
transition={{ duration: 0.8 }}
className="flex flex-col items-center gap-6"
>
<div className="relative w-full max-w-[1400px] mx-auto h-[300px] sm:h-[400px] md:h-[640px] overflow-hidden">
<Image
src="/promo.png"
alt="about-header"
fill
className="object-cover"
sizes="(max-width: 768px) 100vw, 640px"
priority
/>
</div>
</motion.div>
</section>
</>
);
}