62 lines
2.9 KiB
TypeScript
62 lines
2.9 KiB
TypeScript
import { ArrowDown } from "lucide-react";
|
|
import { Fragment } from "react";
|
|
|
|
import { Button } from "@/components/ui/button";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface Hero174Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Hero174 = ({ className }: Hero174Props) => {
|
|
return (
|
|
<Fragment>
|
|
<section
|
|
className={cn(
|
|
"font-dm_sans dark relative h-svh max-h-[1400px] min-h-[600px] w-full bg-[url('/block-media/shadcnblocks/block/full-width-backgrounds/andrew-kliatskyi-MaVm_A0xhKk-unsplash.jpg')] bg-cover bg-center bg-no-repeat after:absolute after:inset-0 after:block after:size-full after:bg-zinc-950/50 after:content-['']",
|
|
className,
|
|
)}
|
|
>
|
|
<div className="relative z-10 mx-auto flex size-full max-w-[125rem] px-4 py-9">
|
|
<div className="flex w-full flex-col justify-between gap-10">
|
|
<div className="mx-auto flex max-w-[31.25rem] flex-1 flex-col items-center justify-center gap-7 sm:max-w-[37.5rem] md:max-w-[50rem]">
|
|
<h1 className="text-center text-xl leading-tight font-medium text-foreground sm:text-2xll md:text-2xll">
|
|
ایدههای خود را به محصولات دیجیتال تبدیل کنید
|
|
</h1>
|
|
<p className="text-center text-lg text-balance text-foreground md:text-xl">
|
|
راهکارهای دیجیتال مقیاسپذیر طراحی میکنیم تا کسبوکارها سریعتر رشد کنند و تجربهای بهتر برای کاربران خود بسازند.
|
|
</p>
|
|
<div className="mt-8 flex flex-wrap items-center justify-center gap-4">
|
|
<Button
|
|
asChild
|
|
className="block h-fit w-fit rounded-sm px-6 py-3.5 text-sm font-semibold tracking-wider text-nowrap uppercase"
|
|
>
|
|
<a href="#">مشاهده پروژهها</a>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
<div className="flex items-center justify-between gap-4 rounded-lg bg-black/20 px-6 py-4 backdrop-blur-sm">
|
|
<div className="flex items-center gap-3">
|
|
<div className="h-8 w-1 bg-primary"></div>
|
|
<div className="text-sm font-medium text-muted-foreground">
|
|
<p className="text-primary">دفتر مرکزی</p>
|
|
<p>دفتر مرکزی شرکت</p>
|
|
</div>
|
|
</div>
|
|
<Button
|
|
variant="outline"
|
|
size="icon"
|
|
className="flex size-10 rounded-full border-2 border-primary transition-colors hover:bg-primary/20"
|
|
>
|
|
<ArrowDown className="m-auto size-5! stroke-primary" />
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</Fragment>
|
|
);
|
|
};
|
|
|
|
export { Hero174 };
|