amirhosein.ashourlooandClaude Sonnet 5
db7d00e473
- Enlarge category carousel thumbnails (90px -> 104-140px responsive) and
confirm the slider/categories/banner static-image slots are all reading
correctly from the CMS (verified live, not a wiring bug)
- Fix installments page dropping "هندزفری و هدفون": it's a level-3 category,
not level-2, so level2.find() silently missed it - use findNode() over the
whole tree instead
- Extend gen-category-placeholders.mjs to generate a placeholder for every
category at every level (was level-2 only), needed for the fix above
- Add /about, /contact, /installments pages
- About: real copy transcribed from the live moalem.shop theme, real
product photos from the API, text-only brand strip (no scraped logos)
- Contact: ContactForm.tsx posts to the real POST /contact-submissions,
branch cards with key-less Google Maps embeds
- Installments: flat brand-colored hero (no photo/gradient), category
highlights reusing the same categories slot images as the homepage
- Replace the placeholder header/footer phone number with the real one, add
real branch addresses and Instagram/Telegram links (src/data/site.ts),
pulled from the live theme's footer
- Wire logo/favicon to GET /website/favicon (getFavicon() in api.ts) instead
of the static bundled files, so a dashboard upload now shows automatically;
layout.tsx metadata is now generateMetadata() to support this. The tenant's
uploaded logo/favicon currently belongs to a different business - the
wiring is correct and will self-correct once that's fixed in the dashboard
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
90 lines
3.3 KiB
TypeScript
90 lines
3.3 KiB
TypeScript
import Link from "next/link";
|
|
import Image from "next/image";
|
|
import { MAIN_NAV, PHONE, PHONE_HREF, SITE_NAME, SITE_TAGLINE, SOCIAL } from "@/data/site";
|
|
import { categoryHref } from "@/lib/slug";
|
|
import type { CategoryNode } from "@/lib/types";
|
|
import { InstagramIcon, PhoneIcon, TelegramIcon } from "./icons";
|
|
import { toFaDigits } from "@/lib/format";
|
|
|
|
export default function Footer({
|
|
categories,
|
|
logoUrl,
|
|
}: {
|
|
categories: CategoryNode[];
|
|
logoUrl: string;
|
|
}) {
|
|
return (
|
|
<footer className="mt-14 border-t border-line bg-surface">
|
|
<div className="boxed grid gap-8 py-10 md:grid-cols-4">
|
|
<div className="md:col-span-2">
|
|
{/* h-9 w-auto so a square dashboard logo and the wide fallback
|
|
wordmark both render undistorted — see Header.tsx. */}
|
|
<Image src={logoUrl} alt={SITE_NAME} width={140} height={40} className="h-9 w-auto object-contain" />
|
|
<p className="mt-3 max-w-md text-[13px] leading-7 text-body">{SITE_TAGLINE}</p>
|
|
<a
|
|
href={PHONE_HREF}
|
|
className="mt-4 inline-flex items-center gap-2 text-[13px] font-bold text-ink transition hover:text-brand"
|
|
>
|
|
<PhoneIcon className="size-4" />
|
|
{PHONE}
|
|
</a>
|
|
|
|
<div className="mt-4 flex items-center gap-2">
|
|
<a
|
|
href={SOCIAL.instagram}
|
|
target="_blank"
|
|
rel="noreferrer"
|
|
aria-label="اینستاگرام موبایل معلم"
|
|
className="flex size-9 items-center justify-center rounded-full border border-line text-ink-soft transition hover:border-brand hover:text-brand"
|
|
>
|
|
<InstagramIcon className="size-4.5" />
|
|
</a>
|
|
<a
|
|
href={SOCIAL.telegram}
|
|
target="_blank"
|
|
rel="noreferrer"
|
|
aria-label="تلگرام موبایل معلم"
|
|
className="flex size-9 items-center justify-center rounded-full border border-line text-ink-soft transition hover:border-brand hover:text-brand"
|
|
>
|
|
<TelegramIcon className="size-4.5" />
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div>
|
|
<h3 className="mb-3 text-[14px]">دستهبندیها</h3>
|
|
<ul className="space-y-2">
|
|
{categories.slice(0, 6).map((cat) => (
|
|
<li key={cat.id}>
|
|
<Link
|
|
href={categoryHref(cat.id, cat.nameFa, cat.name)}
|
|
className="text-[13px] text-body transition hover:text-brand"
|
|
>
|
|
{cat.nameFa || cat.name}
|
|
</Link>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
|
|
<div>
|
|
<h3 className="mb-3 text-[14px]">دسترسی سریع</h3>
|
|
<ul className="space-y-2">
|
|
{MAIN_NAV.map((item) => (
|
|
<li key={item.href}>
|
|
<Link href={item.href} className="text-[13px] text-body transition hover:text-brand">
|
|
{item.label}
|
|
</Link>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="border-t border-line py-4 text-center text-[12px] text-body">
|
|
© {toFaDigits(1404)} {SITE_NAME} — تمامی حقوق محفوظ است.
|
|
</div>
|
|
</footer>
|
|
);
|
|
}
|