103 lines
3.2 KiB
TypeScript
103 lines
3.2 KiB
TypeScript
import { Globe } from "@/components/magicui/globe";
|
|
import { Separator } from "@/components/ui/separator";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
const sections = [
|
|
{
|
|
title: "محصول",
|
|
links: [
|
|
{ name: "نمای کلی پشتیبانی", href: "#" },
|
|
{ name: "قیمتگذاری", href: "#" },
|
|
{ name: "صندوق تیکت", href: "#" },
|
|
{ name: "چت و خودکارسازی", href: "#" },
|
|
],
|
|
},
|
|
{
|
|
title: "شرکت",
|
|
links: [
|
|
{ name: "درباره ما", href: "#" },
|
|
{ name: "تیم", href: "#" },
|
|
{ name: "وبلاگ", href: "#" },
|
|
{ name: "فرصتهای شغلی", href: "#" },
|
|
],
|
|
},
|
|
{
|
|
title: "منابع",
|
|
links: [
|
|
{ name: "پایگاه دانش", href: "#" },
|
|
{ name: "SLA و پشتیبانی", href: "#" },
|
|
{ name: "مطالعات موردی", href: "#" },
|
|
],
|
|
},
|
|
];
|
|
|
|
interface Footer23Props {
|
|
logo?: {
|
|
url: string;
|
|
src: string;
|
|
alt: string;
|
|
title: string;
|
|
};
|
|
className?: string;
|
|
}
|
|
const Footer23 = ({
|
|
logo = {
|
|
url: "https://www.ShadcnBlocks",
|
|
src: "/block-media/shadcnblocks/block/logos/ShadcnBlockscom-icon.svg",
|
|
alt: "لوگوی SupportDesk",
|
|
title: "SupportDesk",
|
|
},
|
|
className,
|
|
}: Footer23Props) => {
|
|
return (
|
|
<section className={cn("", className)}>
|
|
<div className="container">
|
|
<footer>
|
|
<Separator className="my-14" />
|
|
<div className="flex flex-col items-center justify-between gap-6 lg:flex-row">
|
|
<div className="lg:max-w-md">
|
|
<div className="flex items-center justify-start gap-2">
|
|
<a href="https://ShadcnBlocks">
|
|
<img
|
|
src={logo.src}
|
|
alt={logo.alt}
|
|
title={logo.title}
|
|
className="h-10"
|
|
/>
|
|
</a>
|
|
<h2 className="text-xl font-semibold tracking-tight">
|
|
{logo.title}
|
|
</h2>
|
|
</div>
|
|
<p className="mt-4 text-start text-sm text-muted-foreground">
|
|
تیکتها، چت و پایگاه دانش را یکجا مدیریت کنید تا زمان پاسخ کوتاهتر شود.
|
|
</p>
|
|
</div>
|
|
<div className="mt-8 flex w-full flex-wrap justify-between gap-12 lg:mt-0 lg:w-fit">
|
|
{sections.map((section, sectionIdx) => (
|
|
<div key={sectionIdx} className="mb-4">
|
|
<h3 className="mb-4 font-semibold tracking-tight">
|
|
{section.title}
|
|
</h3>
|
|
<ul className="space-y-2 text-sm text-muted-foreground">
|
|
{section.links.map((link, linkIdx) => (
|
|
<li key={linkIdx} className="hover:text-primary">
|
|
<a href={link.href}>{link.name}</a>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
<div className="relative h-52 overflow-hidden lg:h-82">
|
|
<Globe className="absolute top-10 md:scale-125 lg:top-16 lg:scale-150" />
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export { Footer23 };
|