Files
reui-blocks/blocks/feature93.tsx
T

92 lines
2.9 KiB
TypeScript

import { Infinity as InfinityIcon, MessagesSquare, Target } from "lucide-react";
import { Avatar, AvatarImage } from "@/components/ui/avatar";
import { cn } from "@/lib/utils";
const avatars = [
{
src: "/block-media/shadcnblocks/block/avatar-1.webp",
alt: "داشبورد مدیریت ارتباط با مشتری",
className: "size-16",
},
{
src: "/block-media/shadcnblocks/block/avatar-6.webp",
alt: "نمای پایپ‌لاین فروش",
className: "size-24",
},
{
src: "/block-media/shadcnblocks/block/avatar-3.webp",
alt: "پروفایل یکپارچه مشتری",
className: "size-16",
},
];
const features = [
{
title: "تقسیم خودکار سرنخ",
description:
"تاریخچه تماس، قرارداد و تیکت هر مشتری را در یک صفحه ببینید و بدون جستجو تصمیم بگیرید.",
icon: MessagesSquare,
},
{
title: "گزارش عملکرد فروش",
description:
"وظایف تکراری فروش را خودکار کنید و تمرکز تیم را روی بستن معامله بگذارید.",
icon: Target,
},
{
title: "مدیریت قرارداد",
description:
"بر اساس داده واقعی پایپ‌لاین، درآمد ماه‌های آینده را با اطمینان بیشتر تخمین بزنید.",
icon: InfinityIcon,
},
];
interface Feature93Props {
className?: string;
}
const Feature93 = ({ className }: Feature93Props) => {
return (
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
<div className="container">
<div className="text-center">
<span className="flex items-end justify-center">
{avatars.map((avatar, index) => (
<Avatar
key={avatar.src}
className={cn(
"border",
avatar.className,
index > 0 && "-ms-4",
)}
>
<AvatarImage src={avatar.src} alt={avatar.alt} />
</Avatar>
))}
</span>
<h2 className="mt-12 text-xl font-bold lg:text-2xll">
هر سرنخ را تا قرارداد دنبال کنید
</h2>
<div className="mt-20 grid justify-center gap-16 lg:grid-cols-3">
{features.map((feature) => (
<div key={feature.title} className="max-w-md">
<feature.icon
className="mx-auto mb-6 size-12"
strokeWidth={1.5}
/>
<h3 className="mb-4 text-xl font-medium lg:text-xl">
{feature.title}
</h3>
<p className="text-muted-foreground">{feature.description}</p>
</div>
))}
</div>
</div>
</div>
</section>
);
};
export { Feature93 };