83 lines
3.1 KiB
TypeScript
83 lines
3.1 KiB
TypeScript
import {
|
|
AlignCenter,
|
|
Brain,
|
|
Package,
|
|
ReceiptText,
|
|
Timer,
|
|
Vault,
|
|
} from "lucide-react";
|
|
|
|
import { Button } from "@/components/ui/button";
|
|
import { Input } from "@/components/ui/input";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface Hero74Props {
|
|
className?: string;
|
|
}
|
|
|
|
const FEATURES = [
|
|
{ icon: Package, label: "کاملاً قابل سفارشی‌سازی" },
|
|
{ icon: AlignCenter, label: "بینش لحظه‌ای" },
|
|
{ icon: Vault, label: "فضای ذخیره‌سازی امن" },
|
|
{ icon: ReceiptText, label: "رسیدهای هوشمند" },
|
|
{ icon: Timer, label: "پیگیری خودکار" },
|
|
{ icon: Brain, label: "جستجوی هوشمند" },
|
|
] as const;
|
|
|
|
const Hero74 = ({ className }: Hero74Props) => {
|
|
return (
|
|
<section
|
|
className={cn(
|
|
"w-full min-w-0 max-w-full overflow-x-hidden py-32",
|
|
className,
|
|
)}
|
|
>
|
|
<div className="w-full min-w-0">
|
|
<div className="container mx-auto text-center">
|
|
<h1 className="mb-4 text-4xl font-medium tracking-tight text-pretty md:text-5xl">
|
|
پلتفرمی یکپارچه برای مدیریت کسب‌وکار
|
|
</h1>
|
|
<p className="mx-auto max-w-2xl text-muted-foreground">
|
|
همه اطلاعات مالی، اسناد و گزارش‌های مدیریتی را در یک محیط امن و قابل
|
|
جستجو مدیریت کنید.
|
|
</p>
|
|
<div className="mx-auto mt-8 flex w-full max-w-sm items-center gap-2">
|
|
<Input type="email" placeholder="ایمیل خود را وارد کنید" />
|
|
<Button className="shrink-0">پیوستن به لیست انتظار</Button>
|
|
</div>
|
|
<div className="mx-auto mt-12 grid max-w-3xl grid-cols-2 gap-8 md:grid-cols-3 lg:grid-cols-6">
|
|
{FEATURES.map(({ icon: Icon, label }) => (
|
|
<div key={label} className="flex flex-col items-center gap-2">
|
|
<div className="flex h-16 w-24 items-center justify-center rounded-md border">
|
|
<Icon />
|
|
</div>
|
|
<span className="text-sm text-muted-foreground">{label}</span>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
|
|
<div className="relative mt-20 hidden w-full min-w-0 gap-10 overflow-hidden lg:flex">
|
|
<img
|
|
src="/block-media/shadcnblocks/block/placeholder-1.svg"
|
|
alt="تصویر نمونه"
|
|
className="max-h-[500px] min-w-0 flex-1 rounded-e-xl object-cover"
|
|
/>
|
|
<img
|
|
src="/block-media/shadcnblocks/block/placeholder-1.svg"
|
|
alt="تصویر نمونه"
|
|
className="max-h-[500px] min-w-0 flex-1 rounded-s-xl object-cover"
|
|
/>
|
|
<img
|
|
src="/block-media/shadcnblocks/block/placeholder-3.svg"
|
|
alt="تصویر نمونه"
|
|
className="absolute top-1/2 left-1/2 z-10 max-h-80 w-auto max-w-[min(100%,28rem)] -translate-x-1/2 -translate-y-1/2 rounded-xl object-cover shadow-md"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Hero74 };
|