b2in/dev/b2in-layout-v10/src/components/StatsSection.tsx
2025-10-20 17:50:35 +02:00

35 lines
No EOL
1.2 KiB
TypeScript

const StatsSection = () => {
const stats = [
{ number: "01", label: "Premium Locations", value: "500+ Hotels" },
{ number: "02", label: "Guest Satisfaction", value: "4.9 Rating" },
{ number: "03", label: "Years Experience", value: "15+ Years" },
{ number: "04", label: "Countries Served", value: "25+ Countries" },
{ number: "05", label: "Happy Customers", value: "50K+ Guests" },
];
return (
<section className="py-16 lg:py-24 bg-muted/30">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div className="grid grid-cols-2 md:grid-cols-5 gap-8">
{stats.map((stat, index) => (
<div key={index} className="text-center space-y-4">
<div className="text-4xl lg:text-6xl font-light text-secondary">
{stat.number}
</div>
<div className="space-y-2">
<div className="text-sm text-muted-foreground uppercase tracking-wide">
{stat.label}
</div>
<div className="text-lg font-medium">
{stat.value}
</div>
</div>
</div>
))}
</div>
</div>
</section>
);
};
export default StatsSection;