amirhosein.ashourloo
aba78b76a1
- Add /about (business-info driven, falls back to existing copy) and /contact (business-info contact details + a working form posting to the contact-submissions API) - Point header/footer "About"/"Contact" links at the new pages instead of homepage anchors - Replace the hand-drawn social icons with the real brand SVGs from public/icons (Instagram, Telegram, WhatsApp, Bale, Eitaa), inlined with currentColor so hover states work; shared via a single socialLinks list used by both header and footer - Remove the horizontal scrollbar under the product gallery thumbnails by wrapping them instead of scrolling
100 lines
3.9 KiB
TypeScript
100 lines
3.9 KiB
TypeScript
import Link from "next/link";
|
|
import Logo from "./Logo";
|
|
import { headerNavLinks, siteInfo } from "@/data/site";
|
|
import { categoryHref } from "@/lib/slug";
|
|
import type { CategoryNode } from "@/lib/types";
|
|
import { socialLinks } from "./socialLinks";
|
|
import { MailIcon, PhoneIcon, PinIcon } from "./icons";
|
|
|
|
export default function Footer({ categoryColumns }: { categoryColumns: CategoryNode[] }) {
|
|
const categoryItems = categoryColumns.flatMap((col) => col.children).slice(0, 6);
|
|
|
|
return (
|
|
<footer id="contact" className="bg-brand text-white/70 mt-auto">
|
|
<div className="boxed py-12 md:py-16 grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-10">
|
|
<div>
|
|
<Logo dark />
|
|
<p className="mt-4 text-sm leading-7 text-white/55">
|
|
مرجع تخصصی پوشاک بچگانه؛ لباسهای شاد و باکیفیت برای نوزادان،
|
|
دختران و پسران با ارسال به سراسر کشور.
|
|
</p>
|
|
<div className="mt-5 flex items-center gap-3">
|
|
{socialLinks.map(({ icon: Icon, label, href }) => (
|
|
<a
|
|
key={label}
|
|
href={href}
|
|
aria-label={label}
|
|
className="flex items-center justify-center size-9 rounded-full border border-white/15 transition-all duration-200 hover:border-gold hover:bg-gold hover:text-ink hover:scale-110"
|
|
>
|
|
<Icon className="size-4" />
|
|
</a>
|
|
))}
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<h3 className="text-white font-bold text-sm mb-4">دسترسی سریع</h3>
|
|
<ul className="space-y-2.5 text-sm">
|
|
{headerNavLinks.map((link) => (
|
|
<li key={link.title}>
|
|
{link.href.startsWith("#") ? (
|
|
<a href={link.href} className="hover:text-gold transition-colors">
|
|
{link.title}
|
|
</a>
|
|
) : (
|
|
<Link href={link.href} className="hover:text-gold transition-colors">
|
|
{link.title}
|
|
</Link>
|
|
)}
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
|
|
<div>
|
|
<h3 className="text-white font-bold text-sm mb-4">دستهبندیها</h3>
|
|
<ul className="space-y-2.5 text-sm">
|
|
{categoryItems.map((cat) => (
|
|
<li key={cat.id}>
|
|
<Link href={categoryHref(cat)} className="hover:text-gold transition-colors">
|
|
{cat.nameFa}
|
|
</Link>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
|
|
<div>
|
|
<h3 className="text-white font-bold text-sm mb-4">ارتباط با ما</h3>
|
|
<ul className="space-y-3.5 text-sm">
|
|
<li className="flex items-start gap-2.5">
|
|
<PhoneIcon className="size-4 mt-0.5 text-gold shrink-0" />
|
|
<span dir="ltr">{siteInfo.phone}</span>
|
|
</li>
|
|
<li className="flex items-start gap-2.5">
|
|
<PinIcon className="size-4 mt-0.5 text-gold shrink-0" />
|
|
<span>{siteInfo.address}</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="border-t border-white/10">
|
|
<div className="boxed py-5 flex flex-col sm:flex-row items-center justify-between gap-3 text-xs text-white/45">
|
|
<span>
|
|
© {new Date().getFullYear()} تمامی حقوق برای فروشگاه {siteInfo.name} محفوظ است.
|
|
</span>
|
|
<span className="font-en tracking-wider">KIDONE STORE</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="bg-brand-dark">
|
|
<div dir="ltr" className="boxed py-3 flex items-center justify-center gap-2 text-white/55 text-xs">
|
|
<MailIcon className="size-4 shrink-0" />
|
|
<span>طراحی و توسعه توسط تیم تجارت الکترونیک مشکی</span>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
);
|
|
}
|