83 lines
3.8 KiB
TypeScript
83 lines
3.8 KiB
TypeScript
import { ArrowRight } from "lucide-react";
|
|
import React from "react";
|
|
|
|
import { ThreeDMarquee } from "@/components/aceternity/3d-marquee";
|
|
import { Button } from "@/components/ui/button";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface Hero239Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Hero239 = ({ className }: Hero239Props) => {
|
|
const images = [
|
|
"/block-media/shadcnblocks/block/guri3/img1.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img2.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img3.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img4.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img5.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img6.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img7.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img8.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img9.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img10.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img11.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img12.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img13.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img14.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img15.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img16.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img17.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img18.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img19.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img20.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img21.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img22.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img23.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img24.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img25.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img26.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img27.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img1.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img2.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img3.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img4.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img5.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img6.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img7.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img8.jpeg",
|
|
"/block-media/shadcnblocks/block/guri3/img9.jpeg",
|
|
];
|
|
|
|
return (
|
|
<section className={cn("relative w-full overflow-hidden py-32", className)}>
|
|
<div className="container flex min-w-0 flex-col items-center justify-center gap-5 text-center">
|
|
<p className="w-fit rounded-full bg-muted px-4 py-1 text-sm uppercase">
|
|
ری یو آی
|
|
</p>
|
|
<h1 className="mt-3 max-w-xl text-balance break-words text-2xll font-medium font-semibold tracking-tighter lg:max-w-3xl lg:text-2xll">
|
|
با یک بار خرید به تمام کامپوننتهای حرفهای دسترسی داشته باشید
|
|
</h1>
|
|
<p className="max-w-xl text-balance text-muted-foreground">
|
|
صدها بلاک و کامپوننت آماده مبتنی بر رابط کاربری، استایلدهی مدرن و ری یو آی که مستقیماً در پروژههای شما قابل استفاده هستند.
|
|
</p>
|
|
<div className="flex min-w-0 flex-wrap items-center justify-center gap-4">
|
|
<Button>شروع رایگان</Button>
|
|
<Button variant="ghost">
|
|
مشاهده امکانات <ArrowRight className="rtl:rotate-180" />
|
|
</Button>
|
|
</div>
|
|
|
|
<div className="mt-15 flex h-full w-full min-w-0 items-center justify-center overflow-hidden">
|
|
<ThreeDMarquee
|
|
className="w-full min-w-0 max-w-full rounded-none"
|
|
images={images}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Hero239 };
|