Files
New-Optic/components/Footer.tsx
2026-05-16 00:04:02 +01:00

31 lines
1.6 KiB
TypeScript

import Image from "next/image";
import { business, type Locale } from "@/config/business";
import type { Messages } from "@/messages";
import LanguageSwitcher from "./LanguageSwitcher";
export default function Footer({ t, locale, onLocaleChange }: { t: Messages; locale: Locale; onLocaleChange: (locale: Locale) => void }) {
return (
<footer className="px-4 pb-8 pt-14 sm:px-6">
<div className="mx-auto max-w-7xl rounded-[2.5rem] border border-ink/8 bg-white/65 p-7 backdrop-blur">
<div className="flex flex-col gap-8 md:flex-row md:items-center md:justify-between">
<div className="flex items-center gap-4">
<span className="relative grid size-12 place-items-center overflow-hidden rounded-full bg-white shadow-sm">
<Image src={business.assets.logo} alt="New Optic logo" fill sizes="48px" className="object-contain p-1" />
</span>
<div>
<p className="font-semibold text-ink">{business.name}</p>
<p className="mt-1 text-sm text-ink/55">{t.footer.tagline}</p>
</div>
</div>
<LanguageSwitcher locale={locale} onLocaleChange={onLocaleChange} />
</div>
<div className="hairline my-7" />
<div className="flex flex-col gap-3 text-sm text-ink/52 md:flex-row md:items-center md:justify-between">
<p>{business.phone} · {business.whatsapp} · <a href={business.facebookUrl} target="_blank" rel="noreferrer" className="font-semibold text-ink/70 hover:text-optical">Facebook</a></p>
<p>© {new Date().getFullYear()} {business.name}. {t.footer.rights}</p>
</div>
</div>
</footer>
);
}