76 lines
2.7 KiB
TypeScript
76 lines
2.7 KiB
TypeScript
import { cn } from "@/lib/utils";
|
|
import { Clock, ShoppingCart, Eye, FileText, ToggleLeft, Settings } from "lucide-react";
|
|
|
|
interface SolutionSectionProps {
|
|
className?: string;
|
|
}
|
|
|
|
export default function SolutionSection({ className }: SolutionSectionProps) {
|
|
const features = [
|
|
{
|
|
icon: Clock,
|
|
title: "نمایش قیمت لحظهای به مشتریان",
|
|
description: "دسترسی آنی به آخرین قیمتهای بازار"
|
|
},
|
|
{
|
|
icon: ShoppingCart,
|
|
title: "ثبت و مدیریت سفارشها",
|
|
description: "سیستم جامع ثبت و پیگیری سفارشها"
|
|
},
|
|
{
|
|
icon: Eye,
|
|
title: "مشاهده آنلاین مانده حساب هر مشتری",
|
|
description: "دسترسی لحظهای به وضعیت حساب مشتریان"
|
|
},
|
|
{
|
|
icon: FileText,
|
|
title: "دسترسی به ریز کامل معاملات در هر ساعت از شبانهروز",
|
|
description: "گزارشگیری دقیق و کامل از تمام معاملات"
|
|
},
|
|
{
|
|
icon: ToggleLeft,
|
|
title: "کنترل وضعیت بازار (باز / بسته)",
|
|
description: "مدیریت وضعیت بازار به صورت لحظهای"
|
|
},
|
|
{
|
|
icon: Settings,
|
|
title: "پنل مدیریت پیشرفته برای ادمین",
|
|
description: "ابزارهای کامل مدیریت و کنترل سیستم"
|
|
}
|
|
];
|
|
|
|
return (
|
|
<section className={cn("py-16 md:py-24 lg:py-32", className)}>
|
|
<div className="container mx-auto max-w-6xl px-6">
|
|
<div className="flex flex-col items-start gap-8 lg:gap-12 lg:px-16 xl:gap-32">
|
|
<h2 className="text-heading-2 font-semibold md:shrink-0 lg:max-w-1/3 lg:max-w-3xl">
|
|
یک پلتفرم اختصاصی برای مدیریت کامل معاملات
|
|
</h2>
|
|
<div className="grid w-full gap-6 md:grid-cols-2">
|
|
{features.map((feature, index) => {
|
|
const Icon = feature.icon;
|
|
return (
|
|
<div
|
|
key={index}
|
|
className="flex rounded-lg border border-border bg-accent p-6 md:p-8"
|
|
>
|
|
<Icon className="mr-3 size-5 shrink-0 lg:mr-6 lg:size-6 text-primary" />
|
|
<div>
|
|
<div className="text-body-sm mb-3 h-5 font-semibold text-accent-foreground">
|
|
{feature.title}
|
|
</div>
|
|
<div className="text-body-sm font-medium text-muted-foreground">
|
|
{feature.description}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
})}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|
|
|