113 lines
4.1 KiB
TypeScript
113 lines
4.1 KiB
TypeScript
import {
|
|
BarChartHorizontal,
|
|
BatteryCharging,
|
|
CircleHelp,
|
|
Layers,
|
|
WandSparkles,
|
|
ZoomIn,
|
|
} from "lucide-react";
|
|
|
|
import { cn } from "@/lib/utils";
|
|
|
|
const reasons = [
|
|
{
|
|
title: "پاسخ آماده",
|
|
description:
|
|
"پاسخ‌های پرتکرار را ذخیره کنید و با یک کلیک ارسال کنید.",
|
|
icon: ZoomIn,
|
|
},
|
|
{
|
|
title: "SLA هوشمند",
|
|
description:
|
|
"همه کانال‌های ارتباطی را در یک محیط مدیریت کنید و هیچ پیامی گم نشود.",
|
|
icon: BarChartHorizontal,
|
|
},
|
|
{
|
|
title: "نظرسنجی رضایت",
|
|
description:
|
|
"تیکت‌های مهم بر اساس قرارداد یا شدت مسئله در صف بالاتر قرار می‌گیرند.",
|
|
icon: CircleHelp,
|
|
},
|
|
{
|
|
title: "تخصیص خودکار",
|
|
description:
|
|
"مشتریان و تیم با مقالات راهنما سریع‌تر به پاسخ می‌رسند.",
|
|
icon: WandSparkles,
|
|
},
|
|
{
|
|
title: "تاریخچه مشتری",
|
|
description:
|
|
"پاسخ‌های پرتکرار را ذخیره کنید و با یک کلیک ارسال کنید.",
|
|
icon: Layers,
|
|
},
|
|
{
|
|
title: "صندوق یکپارچه",
|
|
description:
|
|
"همه کانال‌های ارتباطی را در یک محیط مدیریت کنید و هیچ پیامی گم نشود.",
|
|
icon: BatteryCharging,
|
|
},
|
|
];
|
|
|
|
interface Feature85Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Feature85 = ({ className }: Feature85Props) => {
|
|
return (
|
|
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
|
|
<div className="border-t">
|
|
<div>
|
|
<div className="relative container overflow-hidden border-x border-muted-foreground/20 py-32">
|
|
<div className="isolate mx-auto flex max-w-3xl flex-col gap-20">
|
|
<div className="bg absolute -start-px -top-1 -z-10 h-full w-full bg-[linear-gradient(to_left,hsl(var(--muted-foreground))_1px,transparent_1px),linear-gradient(to_bottom,hsl(var(--muted-foreground))_1px,transparent_1px)] [mask-image:radial-gradient(ellipse_100%_120%_at_50%_50%,transparent_20%,#000_100%)] bg-[size:64px_64px] opacity-20 [clip-path:inset(0px_0px_50%_0px)]" />
|
|
<h2 className="text-center text-3xl md:text-2xll">
|
|
زمان حل مسئله را کوتاه کنید
|
|
</h2>
|
|
<img
|
|
src="/block-media/shadcnblocks/block/placeholder-1.svg"
|
|
alt="مدیریت تیکت"
|
|
className="max-h-64 w-full rounded-xl object-cover"
|
|
/>
|
|
<p className="text-center text-xl md:text-3xl">
|
|
پاسخ‌های آماده و پایگاه دانش، زمان پاسخ را کم می‌کند و کیفیت را در کل تیم یکسان نگه می‌دارد.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div className="border-t border-muted-foreground/20">
|
|
<div className="container border-x border-muted-foreground/20 px-0">
|
|
<div className="grid gap-px bg-muted-foreground/20 md:grid-cols-2 lg:grid-cols-3">
|
|
{reasons.map((reason) => (
|
|
<div
|
|
key={reason.title}
|
|
className="flex gap-4 bg-muted px-6 pt-8 pb-8 md:flex-col md:gap-0 md:px-8 md:pt-16"
|
|
>
|
|
<reason.icon
|
|
className="size-7 shrink-0 md:size-8"
|
|
strokeWidth={1.5}
|
|
/>
|
|
<div>
|
|
<h3 className="mb-2 md:mt-6 md:text-lg">
|
|
{reason.title}
|
|
</h3>
|
|
<p className="text-muted-foreground">
|
|
{reason.description}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div className="border-x border-t border-muted-foreground/20">
|
|
<div className="container border-x border-muted-foreground/20 py-16" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Feature85 };
|