Template
26 lines
1.0 KiB
TypeScript
26 lines
1.0 KiB
TypeScript
export type StatsProps = {
|
|
heading?: string;
|
|
stats?: Array<{ value: string; label: string; description?: string }>;
|
|
};
|
|
|
|
export default function Stats({ heading = '', stats = [] }: StatsProps) {
|
|
return (
|
|
<section className="bg-background">
|
|
<div className="section-shell py-20 sm:py-24">
|
|
<div className="max-w-3xl">
|
|
{heading && <h2 className="text-4xl font-normal leading-[0.98] tracking-[-0.04em] sm:text-5xl lg:text-6xl">{heading}</h2>}
|
|
</div>
|
|
<div className="mt-12 grid gap-x-10 gap-y-8 sm:grid-cols-2 lg:grid-cols-4">
|
|
{stats.map((stat, index) => (
|
|
<div key={index} className="py-4">
|
|
<p className="text-4xl font-normal tracking-[-0.04em] sm:text-5xl">{stat.value}</p>
|
|
<p className="mt-3 text-sm font-medium">{stat.label}</p>
|
|
{stat.description && <p className="mt-2 text-sm leading-6 text-muted-foreground">{stat.description}</p>}
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|