121 lines
4.2 KiB
TypeScript
121 lines
4.2 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import { JetBrains_Mono } from "next/font/google";
|
|
import { GithubLogoIcon, TwitterLogoIcon } from "@phosphor-icons/react";
|
|
import { Send } from "lucide-react";
|
|
import { Dictionary } from "@/lib/IDict";
|
|
|
|
const jetbrainsMono = JetBrains_Mono({
|
|
subsets: ["latin", "cyrillic"],
|
|
});
|
|
|
|
export function Footer({
|
|
dict,
|
|
lang,
|
|
}: {
|
|
dict: Dictionary["footer"];
|
|
lang: string;
|
|
}) {
|
|
// Динамическая карта сайта с прописанными маршрутами
|
|
const sitemap = [
|
|
{
|
|
title: dict.sections.product,
|
|
links: [
|
|
{ name: dict.links.features, href: `/${lang}#features` },
|
|
{ name: dict.links.pricing, href: `/${lang}#pricing` },
|
|
{ name: dict.links.protocol, href: `/${lang}/docs` }, // Ведет в документацию
|
|
],
|
|
},
|
|
{
|
|
title: dict.sections.resources,
|
|
links: [
|
|
{ name: dict.links.faq, href: `/${lang}#faq` },
|
|
{ name: dict.links.comms, href: `/${lang}/blog` },
|
|
],
|
|
},
|
|
{
|
|
title: dict.sections.legal,
|
|
links: [
|
|
{ name: dict.links.privacy, href: `/${lang}/docs` }, // Ведет в документацию (Legal)
|
|
{ name: dict.links.terms, href: `/${lang}/docs` }, // Ведет в документацию (Legal)
|
|
],
|
|
},
|
|
];
|
|
|
|
return (
|
|
<footer
|
|
className={`mt-20 border-t border-border/50 bg-card/30 backdrop-blur-xl ${jetbrainsMono.className}`}
|
|
>
|
|
<div className="container mx-auto px-6 py-12">
|
|
<div className="grid grid-cols-1 gap-12 md:grid-cols-4 lg:gap-16">
|
|
{/* Блок бренда */}
|
|
<div className="flex flex-col gap-4">
|
|
<Link
|
|
href={`/${lang}`}
|
|
className="text-2xl font-bold tracking-tighter flex items-center gap-2 w-fit"
|
|
>
|
|
<div className="w-3 h-3 bg-primary rounded-full shadow-[0_0_10px_rgba(0,240,255,0.8)] animate-pulse" />
|
|
<span className="text-neon-cyan">{dict.brand}</span>
|
|
</Link>
|
|
<p className="text-muted-foreground text-sm leading-relaxed max-w-[200px]">
|
|
{dict.tagline}
|
|
</p>
|
|
<div className="flex gap-4 mt-2">
|
|
<Link
|
|
href="#"
|
|
className="text-muted-foreground hover:text-primary transition-colors"
|
|
>
|
|
<GithubLogoIcon size={20} />
|
|
</Link>
|
|
<Link
|
|
href="#"
|
|
className="text-muted-foreground hover:text-secondary transition-colors"
|
|
>
|
|
<TwitterLogoIcon size={20} />
|
|
</Link>
|
|
<Link
|
|
href="#"
|
|
className="text-muted-foreground hover:text-primary transition-colors"
|
|
>
|
|
<Send size={20} />
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Динамическая карта сайта */}
|
|
{sitemap.map((section, idx) => (
|
|
<div key={idx} className="flex flex-col gap-4">
|
|
<h4 className="text-foreground font-bold text-sm uppercase tracking-widest">
|
|
{section.title}
|
|
</h4>
|
|
<ul className="flex flex-col gap-2">
|
|
{section.links.map((link, linkIdx) => (
|
|
<li key={linkIdx}>
|
|
<Link
|
|
href={link.href}
|
|
className="text-muted-foreground hover:text-primary text-sm transition-colors duration-200"
|
|
>
|
|
{link.name}
|
|
</Link>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
))}
|
|
</div>
|
|
|
|
{/* Нижняя панель */}
|
|
<div className="mt-16 pt-8 border-t border-border/20 flex flex-col md:flex-row justify-between items-center gap-4">
|
|
<p className="text-xs text-muted-foreground/60">{dict.rights}</p>
|
|
<div className="flex gap-8 text-[10px] uppercase tracking-[0.2em] text-muted-foreground/40 font-bold">
|
|
<span>Uplink: Active</span>
|
|
<span>Node: Node-Th-01</span>
|
|
<span>Latency: 24ms</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
);
|
|
}
|