105 lines
3.6 KiB
TypeScript
105 lines
3.6 KiB
TypeScript
"use client";
|
|
|
|
import { ArrowRight, Check, Copy, Download } from "lucide-react";
|
|
import { useState } from "react";
|
|
import { FaWindows } from "react-icons/fa";
|
|
|
|
import { Button } from "@/components/ui/button";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
interface Download13Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Download13 = ({ className }: Download13Props) => {
|
|
const [copied, setCopied] = useState(false);
|
|
|
|
const handleCopy = () => {
|
|
navigator.clipboard.writeText("winget install Example.App");
|
|
setCopied(true);
|
|
setTimeout(() => setCopied(false), 2000);
|
|
};
|
|
|
|
return (
|
|
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
|
|
<div className="container">
|
|
<span className="mx-auto grid size-28 place-items-center rounded-4xl bg-primary p-4 md:size-32">
|
|
<img
|
|
src="/block-media/shadcnblocks/block/block-1.svg"
|
|
alt="لوگو"
|
|
className="size-16 invert dark:invert-0"
|
|
/>
|
|
</span>
|
|
<h1 className="mt-10 text-center text-xl font-semibold md:text-2xll">
|
|
دانلود اپلیکیشن دسکتاپ
|
|
</h1>
|
|
<p className="mx-auto mt-4 max-w-5xl text-center text-muted-foreground md:mt-6 md:text-xl">
|
|
با نسخه دسکتاپ، بهرهوری بیدرنگ را تجربه کنید. بهروزرسانی خودکار و پشتیبانی چندپلتفرمی در چند دقیقه شروع کنید.
|
|
</p>
|
|
<div className="mt-10 flex flex-col items-center gap-4 md:mt-20">
|
|
<FaWindows className="size-14" />
|
|
<Button className="inline-flex items-center gap-2">
|
|
دانلود برای <span dir="rtl">Windows</span>
|
|
<Download />
|
|
</Button>
|
|
<div
|
|
className="flex items-center gap-1.5 rounded-lg border py-1 ps-4 pe-2"
|
|
dir="rtl"
|
|
>
|
|
<span className="font-mono text-sm">
|
|
winget install Example.App
|
|
</span>
|
|
<Button
|
|
variant="link"
|
|
size="icon"
|
|
onClick={handleCopy}
|
|
className="relative"
|
|
>
|
|
<span
|
|
className={`absolute inset-0 grid place-items-center transition-all duration-250 ${
|
|
copied
|
|
? "scale-75 opacity-0 blur-xs"
|
|
: "blur-0 scale-100 opacity-100"
|
|
}`}
|
|
>
|
|
<Copy />
|
|
</span>
|
|
<span
|
|
className={`absolute inset-0 grid place-items-center transition-all duration-250 ${
|
|
copied
|
|
? "blur-0 scale-100 opacity-100"
|
|
: "scale-75 opacity-0 blur-xs"
|
|
}`}
|
|
>
|
|
<Check className="text-emerald-600" />
|
|
</span>
|
|
</Button>
|
|
</div>
|
|
<a
|
|
href="#"
|
|
className="flex items-center gap-1 text-xs text-muted-foreground hover:underline"
|
|
>
|
|
روشهای نصب دیگر
|
|
<ArrowRight className="size-3 rtl:rotate-180" />
|
|
</a>
|
|
<div className="mt-10 flex flex-col items-center gap-2 md:mt-20">
|
|
<p className="text-sm font-medium text-muted-foreground">
|
|
همه دانلودهای ویندوز:
|
|
</p>
|
|
<div className="flex items-center gap-2">
|
|
<Button variant="outline" size="sm" dir="rtl">
|
|
x64
|
|
</Button>
|
|
<Button variant="outline" size="sm" dir="rtl">
|
|
Arm64
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Download13 };
|