96 lines
3.5 KiB
TypeScript
96 lines
3.5 KiB
TypeScript
"use client";
|
|
|
|
import { Badge } from "@/components/ui/badge";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
const items = [
|
|
{
|
|
title: "Slack",
|
|
description:
|
|
"محصولات را دسته‌بندی کنید و ویژگی‌ها را برای جستجوی بهتر ساختاردهی کنید.",
|
|
number: 400,
|
|
},
|
|
{
|
|
title: "مدیریت محصول",
|
|
description: "پرداخت سریع و امن اعتماد مشتری را در لحظه خرید حفظ می‌کند.",
|
|
number: 4000,
|
|
},
|
|
{
|
|
title: "Dropbox",
|
|
description: "وضعیت ارسال را شفاف نشان دهید و تماس‌های پشتیبانی را کم کنید.",
|
|
number: 7000,
|
|
},
|
|
{
|
|
title: "GitHub",
|
|
description: "کد تخفیف و کمپین را بر اساس رفتار خرید هدف بگیرید.",
|
|
number: 850,
|
|
},
|
|
];
|
|
|
|
interface Feature139Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Feature139 = ({ className }: Feature139Props) => {
|
|
return (
|
|
<section
|
|
dir="rtl"
|
|
lang="fa"
|
|
className={cn(
|
|
"relative w-full max-w-full overflow-hidden py-32",
|
|
className,
|
|
)}
|
|
>
|
|
<div className="container min-w-0 max-w-full">
|
|
<div className="w-full min-w-0 rounded-lg border bg-card p-4 shadow-sm sm:p-6 md:p-10">
|
|
<div className="flex w-full min-w-0 flex-col items-center justify-between gap-6 md:flex-row md:gap-4">
|
|
<div className="w-full min-w-0 max-w-md text-start">
|
|
<Badge
|
|
variant="outline"
|
|
className="px-3 py-2 text-muted-foreground"
|
|
>
|
|
فروش آنلاین
|
|
</Badge>
|
|
<h2 className="my-5 max-w-full text-xl font-medium text-balance break-words lg:text-xl">
|
|
فروش آنلاین را مقیاس‌پذیر کنید
|
|
</h2>
|
|
<p className="max-w-full text-sm text-pretty break-words text-muted-foreground lg:text-base">
|
|
مسیر خرید را بهینه کنید تا سبد رها شده کمتر شود. پیشنهاد هوشمند
|
|
محصول، میانگین سفارش را بالا می‌برد.
|
|
</p>
|
|
<p className="mt-3 max-w-full text-sm text-pretty break-words text-muted-foreground lg:text-base">
|
|
تجربه خرید را روان‌تر بسازید
|
|
</p>
|
|
</div>
|
|
<div className="w-full min-w-0 max-w-lg">
|
|
<img
|
|
src="/block-media/shadcnblocks/block/placeholder-1.svg"
|
|
alt="مدیریت سفارش"
|
|
className="max-h-[420px] w-full max-w-full rounded-lg object-cover"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="mt-12 grid w-full min-w-0 grid-cols-1 justify-between gap-8 sm:mt-16 sm:grid-cols-2 sm:gap-12 md:mt-24 md:grid-cols-4">
|
|
{items.map((item) => (
|
|
<div key={item.title} className="min-w-0 max-w-full text-start">
|
|
<p className="text-xl text-muted-foreground">
|
|
{item.number.toLocaleString("fa-IR")}+
|
|
</p>
|
|
<h6 className="mt-5 mb-3 font-semibold break-words">
|
|
{item.title}
|
|
</h6>
|
|
<p className="text-sm text-pretty break-words text-muted-foreground">
|
|
{item.description}
|
|
</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Feature139 };
|