85 lines
3.0 KiB
TypeScript
85 lines
3.0 KiB
TypeScript
import type { LucideIcon } from "lucide-react";
|
|
import { Cpu, Database, Globe, ShieldCheck } from "lucide-react";
|
|
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface FeatureItem {
|
|
id: string;
|
|
title: string;
|
|
description: string;
|
|
icon: LucideIcon;
|
|
}
|
|
|
|
const FEATURES: FeatureItem[] = [
|
|
{
|
|
id: "global-distribution",
|
|
title: "موجودی انبار",
|
|
description:
|
|
"محصولات را دسته‌بندی کنید و ویژگی‌ها را برای جستجوی بهتر ساختاردهی کنید.",
|
|
icon: Globe,
|
|
},
|
|
{
|
|
id: "scalable-compute",
|
|
title: "بازگشت مشتری",
|
|
description:
|
|
"پرداخت سریع و امن اعتماد مشتری را در لحظه خرید حفظ می‌کند.",
|
|
icon: Cpu,
|
|
},
|
|
{
|
|
id: "managed-databases",
|
|
title: "صفحه فرود",
|
|
description:
|
|
"وضعیت ارسال را شفاف نشان دهید و تماس‌های پشتیبانی را کم کنید.",
|
|
icon: Database,
|
|
},
|
|
{
|
|
id: "layered-security",
|
|
title: "گزارش فروش",
|
|
description:
|
|
"کد تخفیف و کمپین را بر اساس رفتار خرید هدف بگیرید.",
|
|
icon: ShieldCheck,
|
|
},
|
|
];
|
|
|
|
interface Feature230Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Feature230 = ({ className }: Feature230Props) => {
|
|
return (
|
|
<section dir="rtl" lang="fa" className={cn("overflow-hidden py-32", className)}>
|
|
<div className="relative container">
|
|
<div className="absolute -top-px left-1/2 h-px w-screen -translate-x-1/2 bg-border" />
|
|
<img
|
|
src="/block-media/shadcnblocks/block/placeholder-1.svg"
|
|
alt="مدیریت سفارش"
|
|
className="relative left-1/2 aspect-video max-h-[680px] w-screen max-w-none -translate-x-1/2 rounded-b-xl border-b border-border object-cover lg:static lg:max-w-full lg:translate-x-0 lg:border-x"
|
|
/>
|
|
<div className="mt-20 grid gap-8 lg:grid-cols-10">
|
|
<div className="text-start lg:col-span-4">
|
|
<h2 className="mb-8 text-2xll font-medium text-balance md:text-2xll">
|
|
فروش آنلاین را مقیاس‌پذیر کنید
|
|
</h2>
|
|
<p className="text-xl text-pretty text-muted-foreground">
|
|
مسیر خرید را بهینه کنید تا سبد رها شده کمتر شود. پیشنهاد هوشمند محصول، میانگین سفارش را بالا می‌برد.
|
|
</p>
|
|
</div>
|
|
<div className="grid gap-8 sm:grid-cols-2 lg:col-span-6">
|
|
{FEATURES.map((feature) => (
|
|
<div key={feature.id} className="text-start">
|
|
<feature.icon className="size-6" />
|
|
<h3 className="mt-4 text-lg font-medium">{feature.title}</h3>
|
|
<p className="mt-2 text-pretty text-muted-foreground">
|
|
{feature.description}
|
|
</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Feature230 };
|