139 lines
5.0 KiB
TypeScript
139 lines
5.0 KiB
TypeScript
"use client";
|
|
|
|
import Link from "next/link";
|
|
import Image from "next/image";
|
|
import { Instagram, Phone, Mail, MessageSquare } from "lucide-react";
|
|
import { useTranslations } from "next-intl";
|
|
import Logo from "@/public/logo.png";
|
|
|
|
export default function Footer() {
|
|
const t = useTranslations("common");
|
|
|
|
return (
|
|
<footer className="hidden lg:block w-full bg-white border-t border-gray-200 mt-auto">
|
|
<div className="mx-auto px-4 lg:px-6 max-w-[1520px] py-6">
|
|
<Link
|
|
href="/"
|
|
className="inline-block transition-opacity hover:opacity-80"
|
|
>
|
|
<div className="relative h-34 w-[200px]">
|
|
<Image
|
|
src={Logo}
|
|
alt="Logo"
|
|
fill
|
|
className="object-contain object-left"
|
|
/>
|
|
</div>
|
|
</Link>
|
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 pb-4">
|
|
{/* Logo and Tagline */}
|
|
<div className="col-span-1 md:col-span-1 space-y-3">
|
|
<p className="text-base text-gray-500 max-w-xs">
|
|
SmartElectronics - yerli we daşary ýurt harytlarynyň onlaýn
|
|
marketi.
|
|
</p>
|
|
<ul className="space-y-3">
|
|
<li>
|
|
<Link
|
|
className="mt-4 text-base text-gray-500 max-w-xs"
|
|
href="/info"
|
|
>
|
|
{t("about_us")}
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<Link
|
|
className="mt-4 text-base text-gray-500 max-w-xs"
|
|
href="/info"
|
|
>
|
|
{t("contact_us")}
|
|
</Link>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
{/* Quick Links / Contact Info */}
|
|
<div className="space-y-4">
|
|
<h3 className="font-bold text-gray-900 text-lg">
|
|
{t("contact_us")}
|
|
</h3>
|
|
<div className="flex justify-between">
|
|
<ul className="space-y-3">
|
|
<li>
|
|
<a
|
|
href="tel:+99365123456"
|
|
className="flex items-center gap-3 text-gray-600 hover:text-primary transition-colors group"
|
|
>
|
|
<div className="p-2 rounded-full bg-gray-50 group-hover:bg-primary/10 transition-colors">
|
|
<Phone className="h-5 w-5" />
|
|
</div>
|
|
<span>+993 65 123456</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a
|
|
href="https://instagram.com/smartelectronics"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="flex items-center gap-3 text-gray-600 hover:text-primary transition-colors group"
|
|
>
|
|
<div className="p-2 rounded-full bg-gray-50 group-hover:bg-primary/10 transition-colors">
|
|
<Instagram className="h-5 w-5" />
|
|
</div>
|
|
<span>@smartelectronics</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<ul className="space-y-3">
|
|
{" "}
|
|
<li>
|
|
<a
|
|
href="mailto:info@smartelectronics.com"
|
|
className="flex items-center gap-3 text-gray-600 hover:text-primary transition-colors group"
|
|
>
|
|
<div className="p-2 rounded-full bg-gray-50 group-hover:bg-primary/10 transition-colors">
|
|
<Mail className="h-5 w-5" />
|
|
</div>
|
|
<span>info@smartelectronics.com</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<div className="flex items-center gap-3 text-gray-600 group">
|
|
<div className="p-2 rounded-full bg-gray-50">
|
|
<MessageSquare className="h-5 w-5" />
|
|
</div>
|
|
<div className="flex flex-col">
|
|
<span className="text-xs text-gray-400 font-medium">
|
|
{t("imo")}
|
|
</span>
|
|
<span>+993 65 123456</span>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
{/* Placeholder for other sections if needed */}
|
|
<div className="hidden md:block"></div>
|
|
<div className="hidden md:block"></div>
|
|
</div>
|
|
|
|
<div className="mt-6 pt-6 border-t border-gray-100 flex flex-col md:flex-row justify-between items-center gap-4 text-sm text-gray-400">
|
|
<p>
|
|
© {new Date().getFullYear()} SmartElectronics. All rights reserved.
|
|
</p>
|
|
<div className="flex gap-6">
|
|
<Link href="#" className="hover:text-gray-600 transition-colors">
|
|
Terms
|
|
</Link>
|
|
<Link href="#" className="hover:text-gray-600 transition-colors">
|
|
Privacy
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
);
|
|
}
|