69 lines
2.5 KiB
TypeScript
69 lines
2.5 KiB
TypeScript
import { Iphone } from "@/components/magicui/iphone";
|
|
import { Badge } from "@/components/ui/badge";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface Download7Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Download7 = ({ className }: Download7Props) => {
|
|
return (
|
|
<section
|
|
dir="rtl"
|
|
lang="fa"
|
|
className={cn("overflow-hidden py-32", className)}
|
|
>
|
|
<div className="container border-b border-border">
|
|
<div className="flex flex-col items-center gap-10">
|
|
<Badge variant="outline">شروع کنید</Badge>
|
|
<h1 className="text-center text-2xll font-bold text-balance md:text-2xll">
|
|
اپلیکیشن فروش را روی همه دستگاهها داشته باشید و از همین امروز گردشکار فروش را متحول کنید
|
|
</h1>
|
|
</div>
|
|
<div className="mt-16 flex flex-col items-center justify-center gap-6 sm:flex-row">
|
|
<a href="#">
|
|
<img
|
|
src="/block-media/shadcnblocks/block/badges/appstore.svg"
|
|
alt="دانلود از اپ استور"
|
|
/>
|
|
</a>
|
|
<a href="#">
|
|
<img
|
|
src="/block-media/shadcnblocks/block/badges/googleplay.svg"
|
|
alt="دانلود از گوگل پلی"
|
|
/>
|
|
</a>
|
|
</div>
|
|
<div className="mt-28 flex items-end justify-center gap-4">
|
|
<div className="order-2 h-[600px] w-full max-w-sm overflow-hidden md:h-[350px] lg:h-[450px] xl:h-[600px]">
|
|
<div className="relative">
|
|
<Iphone
|
|
className="dark"
|
|
src="/block-media/shadcnblocks/block/placeholder-phone-1.svg"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div className="order-1 hidden h-[250px] w-full max-w-sm overflow-hidden md:block lg:h-[350px] xl:h-[450px]">
|
|
<div className="relative">
|
|
<Iphone
|
|
className="dark size-full"
|
|
src="/block-media/shadcnblocks/block/placeholder-phone-2.svg"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div className="order-3 hidden h-[250px] w-full max-w-sm overflow-hidden md:block lg:h-[350px] xl:h-[450px]">
|
|
<div className="relative">
|
|
<Iphone
|
|
className="dark size-full"
|
|
src="/block-media/shadcnblocks/block/placeholder-phone-3.svg"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Download7 };
|