39 lines
1.2 KiB
TypeScript
39 lines
1.2 KiB
TypeScript
"use client";
|
|
|
|
import { motion } from "framer-motion";
|
|
|
|
const stats = [
|
|
{ value: "3", label: "Categories" },
|
|
{ value: "∞", label: "Possibilities" },
|
|
{ value: "1", label: "Winner Per Category" },
|
|
{ value: "100%", label: "Free Entry" },
|
|
];
|
|
|
|
export default function Stats() {
|
|
return (
|
|
<section className="py-16 bg-lime-400">
|
|
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div className="grid grid-cols-2 lg:grid-cols-4 gap-8">
|
|
{stats.map((stat, index) => (
|
|
<motion.div
|
|
key={stat.label}
|
|
initial={{ opacity: 0, scale: 0.8 }}
|
|
whileInView={{ opacity: 1, scale: 1 }}
|
|
viewport={{ once: true }}
|
|
transition={{ duration: 0.5, delay: index * 0.1 }}
|
|
className="text-center"
|
|
>
|
|
<div className="text-5xl sm:text-6xl font-black text-black mb-2">
|
|
{stat.value}
|
|
</div>
|
|
<div className="text-black/70 font-medium tracking-wide uppercase text-sm">
|
|
{stat.label}
|
|
</div>
|
|
</motion.div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|