84 lines
3.0 KiB
TypeScript
84 lines
3.0 KiB
TypeScript
import { cn } from "@/lib/utils";
|
|
|
|
const heroFeature = {
|
|
title: "همکاری فروش و بازاریابی",
|
|
description:
|
|
"اهداف فردی و تیمی را شفاف تعریف کنید و پیشرفت را لحظه‌ای ببینید.",
|
|
image: "/block-media/shadcnblocks/block/placeholder-dark-8-wide.svg",
|
|
imageAlt: "صف اولویت سرنخ‌ها",
|
|
};
|
|
|
|
const subFeatures = [
|
|
{
|
|
title: "اولویت‌بندی سرنخ",
|
|
description:
|
|
"سرنخ‌های با بالاترین احتمال تبدیل را در بالای صف کار روزانه قرار دهید.",
|
|
image: "/block-media/shadcnblocks/block/placeholder-dark-1.svg",
|
|
imageAlt: "داشبورد عملکرد فروش",
|
|
},
|
|
{
|
|
title: "قالب پیشنهاد فروش",
|
|
description:
|
|
"پیشنهادهای حرفه‌ای را در چند دقیقه بسازید و زمان آماده‌سازی را کم کنید.",
|
|
image: "/block-media/shadcnblocks/block/placeholder-dark-2.svg",
|
|
imageAlt: "نمودار نرخ تبدیل",
|
|
},
|
|
{
|
|
title: "ردیابی کووت",
|
|
description:
|
|
"وضعیت هر پیشنهاد را از ارسال تا امضا بدون پیگیری دستی دنبال کنید.",
|
|
image: "/block-media/shadcnblocks/block/placeholder-dark-3.svg",
|
|
imageAlt: "صف اولویت سرنخ‌ها",
|
|
},
|
|
];
|
|
|
|
interface Feature56Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Feature56 = ({ className }: Feature56Props) => {
|
|
return (
|
|
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
|
|
<div className="container flex flex-col gap-6 lg:px-32">
|
|
<div className="flex flex-col rounded-lg border border-border bg-accent p-8">
|
|
<p className="mb-2 text-sm font-semibold md:text-base">
|
|
{heroFeature.title}
|
|
</p>
|
|
<p className="mb-8 text-sm text-muted-foreground md:text-base">
|
|
{heroFeature.description}
|
|
</p>
|
|
<img
|
|
src={heroFeature.image}
|
|
alt={heroFeature.imageAlt}
|
|
className="rounded-md lg:mt-auto lg:w-full"
|
|
/>
|
|
</div>
|
|
<div className="grid gap-6 lg:grid-cols-3">
|
|
{subFeatures.map((feature) => (
|
|
<div
|
|
key={feature.title}
|
|
className="grid-cols-2 gap-x-20 rounded-lg border border-border bg-accent p-6 md:grid md:p-8 lg:flex lg:flex-col"
|
|
>
|
|
<div className="flex flex-col">
|
|
<p className="mb-2 text-sm font-semibold md:text-base">
|
|
{feature.title}
|
|
</p>
|
|
<p className="mb-8 text-sm text-muted-foreground md:text-base">
|
|
{feature.description}
|
|
</p>
|
|
</div>
|
|
<img
|
|
src={feature.image}
|
|
alt={feature.imageAlt}
|
|
className="rounded-md lg:mt-auto lg:w-full"
|
|
/>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Feature56 };
|