124 lines
4.4 KiB
TypeScript
124 lines
4.4 KiB
TypeScript
"use client";
|
|
|
|
import { Download } from "lucide-react";
|
|
import { FaApple, FaGooglePlay, FaLinux, FaWindows } from "react-icons/fa";
|
|
import { SiDebian } from "react-icons/si";
|
|
|
|
import { GlareCard } from "@/components/aceternity/glare-card";
|
|
import { Button } from "@/components/ui/button";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
const platformLabels: Record<string, { label: string; dir?: "ltr" }> = {
|
|
ios: { label: "iOS", dir: "ltr" },
|
|
android: { label: "اندروید" },
|
|
windows: { label: "Windows", dir: "ltr" },
|
|
mac: { label: "macOS", dir: "ltr" },
|
|
linux: { label: "Linux", dir: "ltr" },
|
|
};
|
|
|
|
type DownloadVariant = {
|
|
icon: React.ComponentType<{ className?: string }>;
|
|
label: string;
|
|
dir?: "ltr";
|
|
};
|
|
|
|
const downloadData: Record<string, DownloadVariant[]> = {
|
|
ios: [{ icon: FaApple, label: "اپ استور" }],
|
|
android: [
|
|
{ icon: FaGooglePlay, label: "گوگل پلی" },
|
|
{ icon: Download, label: "APK مستقیم", dir: "ltr" },
|
|
],
|
|
windows: [
|
|
{ icon: FaWindows, label: "نصبکننده (.exe)", dir: "ltr" },
|
|
{ icon: Download, label: "نسخه قابلحمل (.zip)", dir: "ltr" },
|
|
],
|
|
mac: [
|
|
{ icon: FaApple, label: "DMG", dir: "ltr" },
|
|
{ icon: Download, label: "Universal (.zip)", dir: "ltr" },
|
|
],
|
|
linux: [
|
|
{ icon: FaLinux, label: "AppImage", dir: "ltr" },
|
|
{ icon: SiDebian, label: "Debian (.deb)", dir: "ltr" },
|
|
{ icon: Download, label: "Tarball (.tar.gz)", dir: "ltr" },
|
|
],
|
|
};
|
|
|
|
interface Download8Props {
|
|
className?: string;
|
|
}
|
|
|
|
const Download8 = ({ className }: Download8Props) => {
|
|
return (
|
|
<section dir="rtl" lang="fa" className={cn("py-32", className)}>
|
|
<div className="container">
|
|
<div className="flex flex-col items-center justify-center gap-11">
|
|
<div className="[&>div]:aspect-square [&>div]:size-56 sm:[&>div]:size-64 [&>div>div]:border-border">
|
|
<GlareCard className="flex flex-col items-center justify-center bg-primary dark:bg-background">
|
|
<div className="absolute inset-0 flex h-full w-full items-center justify-center p-8">
|
|
<img
|
|
className="object-cover opacity-85 invert"
|
|
alt="لوگو"
|
|
src="/block-media/shadcnblocks/block/block-1.svg"
|
|
/>
|
|
</div>
|
|
</GlareCard>
|
|
</div>
|
|
<h1 className="text-xl font-semibold sm:text-2xll" dir="rtl">
|
|
اپلیکیشن فروش
|
|
</h1>
|
|
</div>
|
|
<div className="mt-11 flex flex-col items-center justify-center gap-4">
|
|
<Button size="lg" className="inline-flex items-center gap-2">
|
|
دانلود (تشخیص سیستمعامل)
|
|
<Download />
|
|
</Button>
|
|
<p className="text-sm text-muted-foreground">
|
|
آخرین بهروزرسانی: ۲۳ شهریور ۱۴۰۴
|
|
</p>
|
|
</div>
|
|
<div className="mt-8">
|
|
<div className="mx-auto max-w-2xl">
|
|
<div className="divide-y divide-border rounded-lg border border-border">
|
|
{Object.entries(downloadData).map(([platform, variants]) => {
|
|
const platformMeta = platformLabels[platform];
|
|
return (
|
|
<div
|
|
key={platform}
|
|
className="grid grid-cols-2 gap-4 px-4 py-3"
|
|
>
|
|
<span
|
|
className="text-sm font-medium"
|
|
dir={platformMeta?.dir}
|
|
>
|
|
{platformMeta?.label ?? platform}
|
|
</span>
|
|
<div className="flex flex-col gap-2">
|
|
{variants.map((variant, variantIdx) => {
|
|
const IconComponent = variant.icon;
|
|
return (
|
|
<Button
|
|
key={variantIdx}
|
|
size="sm"
|
|
variant="outline"
|
|
dir={variant.dir}
|
|
className="inline-flex cursor-pointer items-center gap-2"
|
|
>
|
|
{variant.label}
|
|
<IconComponent className="size-4 shrink-0" />
|
|
</Button>
|
|
);
|
|
})}
|
|
</div>
|
|
</div>
|
|
);
|
|
})}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Download8 };
|