Files
reui-blocks/blocks/faq15.tsx
T

75 lines
2.5 KiB
TypeScript

import type { LucideIcon } from "lucide-react";
import { Clock, Heart, Home, Wallet } from "lucide-react";
import { cn } from "@/lib/utils";
interface FaqItem {
icon: LucideIcon;
heading: string;
description: string;
}
interface Faq15Props {
title?: string;
items?: FaqItem[];
className?: string;
}
const defaultItems: FaqItem[] = [
{
icon: Heart,
heading: "سرنخ‌ها دیگر گم نمی‌شوند",
description:
"هر ورودی از فرم و تبلیغ در یک قیف ثبت می‌شود تا پیگیری‌ها شفاف بماند و فرصت فروش از دست نرود.",
},
{
icon: Wallet,
heading: "هزینه جذب قابل اندازه‌گیری",
description:
"هزینه هر کانال را کنار تبدیل ببینید و بودجه را روی مسیرهایی بگذارید که واقعاً درآمد می‌سازند.",
},
{
icon: Clock,
heading: "پیگیری بدون کار دستی تکراری",
description:
"یادآور تماس و ایمیل خودکار زمان تیم را آزاد می‌کند تا روی مذاکره متمرکز بمانند، نه روی صفحه‌گسترده.",
},
{
icon: Home,
heading: "گزارش یکسان برای کل سازمان",
description:
"مدیران و کارشناسان یک منبع حقیقت دارند؛ پیش‌بینی فروش و عملکرد تیم بدون نسخه پراکنده Excel.",
},
];
const Faq15 = ({
title = "چرا تیم‌های فروش سراغ CRM یکپارچه می‌روند؟",
items = defaultItems,
className,
}: Faq15Props) => {
return (
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
<div className="container mx-auto max-w-3xl">
<h2 className="text-center text-3xl font-semibold md:text-2xll">
{title}
</h2>
<ul className="mt-12 grid grid-cols-1 gap-8 text-start md:grid-cols-2 md:gap-10">
{items.map((item, idx) => (
<li className="flex flex-col gap-2.5" key={idx}>
<div className="flex items-center gap-2 md:gap-2.5">
<item.icon className="size-5 shrink-0 md:size-6" />
<h3 className="font-semibold md:text-lg">{item.heading}</h3>
</div>
<p className="text-sm text-muted-foreground md:text-base">
{item.description}
</p>
</li>
))}
</ul>
</div>
</section>
);
};
export { Faq15 };