66 lines
2.3 KiB
TypeScript
66 lines
2.3 KiB
TypeScript
import { ArrowRight, Check } from "lucide-react";
|
|
|
|
import { Button } from "@/components/ui/button";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface Cta4Props {
|
|
title?: string;
|
|
description?: string;
|
|
buttonText?: string;
|
|
buttonUrl?: string;
|
|
items?: string[];
|
|
className?: string;
|
|
}
|
|
|
|
const defaultItems = [
|
|
"یکپارچه‌سازی سریع با سرویس‌ها",
|
|
"پشتیبانی تخصصی",
|
|
"شخصی‌سازی کامل رابط کاربری",
|
|
"آماده رشد کسب‌وکار",
|
|
"صدها کامپوننت آماده",
|
|
];
|
|
|
|
const Cta4 = ({
|
|
title = "همین امروز شروع کنید",
|
|
description = "با استفاده از ابزارها و قابلیت‌های آماده، زمان توسعه را کاهش دهید، کیفیت محصول را افزایش دهید و سریع‌تر به بازار برسید.",
|
|
buttonText = "شروع رایگان",
|
|
buttonUrl = "https://ShadcnBlocks",
|
|
items = defaultItems,
|
|
className,
|
|
}: Cta4Props) => {
|
|
return (
|
|
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
|
|
<div className="container mx-auto">
|
|
<div className="flex justify-center">
|
|
<div className="max-w-5xl">
|
|
<div className="flex flex-col items-start justify-between gap-8 rounded-lg bg-muted px-6 py-10 md:flex-row lg:px-20 lg:py-16">
|
|
<div className="text-start md:w-1/2">
|
|
<h4 className="mb-1 text-xl font-bold md:text-3xl">{title}</h4>
|
|
<p className="text-muted-foreground">{description}</p>
|
|
<Button className="mt-6" asChild>
|
|
<a href={buttonUrl} target="_blank">
|
|
{buttonText}
|
|
<ArrowRight className="ms-2 size-4 rtl:rotate-180" />
|
|
</a>
|
|
</Button>
|
|
</div>
|
|
<div className="md:w-1/3">
|
|
<ul className="flex flex-col space-y-2 text-sm font-medium">
|
|
{items.map((item, idx) => (
|
|
<li className="flex items-center" key={idx}>
|
|
<Check className="me-4 size-4 shrink-0" />
|
|
{item}
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Cta4 };
|