68 lines
2.7 KiB
TypeScript
68 lines
2.7 KiB
TypeScript
"use client";
|
|
|
|
import { ArrowRight } from "lucide-react";
|
|
|
|
import { Badge } from "@/components/ui/badge";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
const items = [
|
|
"هر سرنخ را تا قرارداد دنبال کنید",
|
|
"مدیریت فروش",
|
|
"سامانه مدیریت ارتباط با مشتری",
|
|
"فروش تیمتان را یکجا مدیریت کنید",
|
|
];
|
|
|
|
interface Feature143Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Feature143 = ({ className }: Feature143Props) => {
|
|
return (
|
|
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
|
|
<div className="container">
|
|
<div className="mt-20 flex flex-col items-center justify-center gap-16 md:flex-row">
|
|
<div className="w-full max-w-sm text-start">
|
|
<h6 className="text-3xl">
|
|
تاریخچه تماس، قرارداد و تیکت هر مشتری را در یک صفحه ببینید و بدون جستجو تصمیم بگیرید.
|
|
</h6>
|
|
<Badge variant="outline" className="mt-8 bg-muted px-3 py-2">
|
|
ارتباط با مشتری
|
|
</Badge>
|
|
|
|
<div className="mt-16 mb-4 h-px w-full bg-muted-foreground" />
|
|
|
|
<ul className="flex flex-col gap-2">
|
|
{items.map((item) => (
|
|
<li className="flex items-center gap-2 text-lg" key={item}>
|
|
<ArrowRight className="size-5 shrink-0 rtl:rotate-180" />
|
|
{item}
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
|
|
<div className="grid w-full max-w-md grid-cols-[1fr_4fr_1fr] grid-rows-[1fr_4fr_1fr] rounded-lg bg-linear-to-br from-red-100 to-blue-100 md:max-w-xl">
|
|
<div className="border-e-2 border-b-2 border-muted-foreground/30 p-4" />
|
|
<div className="border-b-2 border-muted-foreground/30 p-4" />
|
|
<div className="border-b-2 border-s-2 border-muted-foreground/30 p-4" />
|
|
<div className="border-e-2 border-muted-foreground/30 p-4" />
|
|
<div>
|
|
<img
|
|
src="/block-media/shadcnblocks/block/placeholder-1.svg"
|
|
alt="داشبورد مدیریت ارتباط با مشتری"
|
|
className="max-h-[740px] w-full rounded-xl object-cover"
|
|
/>
|
|
</div>
|
|
<div className="border-s-2 border-muted-foreground/30 p-4" />
|
|
<div className="border-t-2 border-e-2 border-muted-foreground/30 p-4" />
|
|
<div className="border-t-2 border-muted-foreground/30 p-4" />
|
|
<div className="border-t-2 border-s-2 border-muted-foreground/30 p-4" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Feature143 };
|