Files
reui-blocks/blocks/stats6.tsx
T

65 lines
2.4 KiB
TypeScript

import { Button } from "@/components/ui/button";
import { cn } from "@/lib/utils";
const formatNumber = (value: number) => value.toLocaleString("fa-IR");
interface Stats6Props {
className?: string;
}
const Stats6 = ({ className }: Stats6Props) => {
return (
<section dir="rtl" lang="fa" className={cn("bg-accent py-32", className)}>
<div className="container flex flex-col items-start text-start">
<div className="mb-12 w-full md:mb-16">
<h2 className="mb-8 w-full max-w-[24rem] text-3xl font-bold text-pretty sm:text-xl md:max-w-[30rem] lg:max-w-[37rem] lg:text-2xll">
بینش‌های عملکرد پلتفرم
</h2>
<div className="flex flex-col justify-start gap-2 sm:flex-row">
<Button className="w-full sm:w-auto">شروع کنید</Button>
<Button variant="outline" className="w-full sm:w-auto">
بیشتر بدانید
</Button>
</div>
</div>
<div className="grid w-full grid-cols-2 gap-12 sm:w-fit sm:grid-cols-4 lg:gap-16">
<div className="w-full">
<div className="mb-2 text-xl font-semibold sm:text-xl lg:text-2xll">
{formatNumber(90)}٪
</div>
<div className="text-base leading-6 text-muted-foreground lg:text-lg">
رضایت مشتری
</div>
</div>
<div className="w-full">
<div className="mb-2 text-xl font-semibold sm:text-xl lg:text-2xll">
{formatNumber(200)}+
</div>
<div className="text-base leading-6 text-muted-foreground lg:text-lg">
تیم‌های فعال
</div>
</div>
<div className="w-full">
<div className="mb-2 text-xl font-semibold sm:text-xl lg:text-2xll">
{formatNumber(99)}٪
</div>
<div className="text-base leading-6 text-muted-foreground lg:text-lg">
در دسترس بودن سامانه
</div>
</div>
<div className="w-full">
<div className="mb-2 text-xl font-semibold sm:text-xl lg:text-2xll">
{formatNumber(150)}+
</div>
<div className="text-base leading-6 text-muted-foreground lg:text-lg">
یکپارچه‌سازی‌های آماده
</div>
</div>
</div>
</div>
</section>
);
};
export { Stats6 };