SPB Git

spb/phi-conseil

Public
4.1 KB · 108 lines tsx
1import Link from "next/link";2import { site } from "@/lib/content";3import { LogoMark } from "@/components/graphics/Logo";4import { LinkedInIcon, MailIcon } from "@/components/ui/Icons";5import { currentYear } from "@/lib/time";6import { ManageCookiesButton } from "@/components/consent/CookieConsent";78export async function Footer() {9  const year = await currentYear();10  const hasLinkedIn = site.social.linkedin !== "";11  const hasEmail = site.contact.email !== "";12  return (13    <footer className="bg-ivory-50 text-ink-700">14      <div className="container-site py-8 md:py-10">15        <div className="flex flex-col gap-8 md:flex-row md:items-center md:justify-between">16          <Link17            href="/"18            className="flex items-center gap-3 rounded-md"19            aria-label={`${site.brand.name} — Accueil`}20          >21            <LogoMark className="text-gold-500 h-9 w-auto" />22            <span className="text-navy-900 font-serif text-2xl">{site.brand.name}</span>23          </Link>2425          <nav aria-label="Navigation de pied de page">26            <ul className="flex flex-wrap items-center gap-x-0 gap-y-2 text-sm">27              {site.navigation.map((item, i) => (28                <li key={item.href} className="flex items-center">29                  {i > 0 ? (30                    <span aria-hidden="true" className="bg-ink-300/70 mx-4 h-4 w-px" />31                  ) : null}32                  <Link33                    href={item.href}34                    className="text-ink-700 hover:text-navy-900 rounded-sm underline-offset-4 hover:underline"35                  >36                    {item.label}37                  </Link>38                </li>39              ))}40            </ul>41          </nav>4243          {hasLinkedIn || hasEmail ? (44            <ul className="flex items-center gap-4" aria-label="Réseaux et contact">45              {hasLinkedIn ? (46                <li>47                  <a48                    href={site.social.linkedin}49                    target="_blank"50                    rel="noopener noreferrer"51                    aria-label="LinkedIn (nouvelle fenêtre)"52                    className="text-navy-900 hover:bg-navy-900/5 inline-flex h-10 w-10 items-center justify-center rounded-md"53                  >54                    <LinkedInIcon />55                  </a>56                </li>57              ) : null}58              {hasEmail ? (59                <li>60                  <a61                    href={`mailto:${site.contact.email}`}62                    aria-label="Nous écrire par courriel"63                    className="text-navy-900 hover:bg-navy-900/5 inline-flex h-10 w-10 items-center justify-center rounded-md"64                  >65                    <MailIcon />66                  </a>67                </li>68              ) : null}69            </ul>70          ) : (71            <Link72              href="/nous-joindre"73              aria-label="Nous joindre"74              className="text-navy-900 hover:bg-navy-900/5 inline-flex h-10 w-10 items-center justify-center rounded-md"75            >76              <MailIcon />77            </Link>78          )}79        </div>8081        <div className="border-ink-300/30 text-ink-500 mt-8 flex flex-col gap-3 border-t pt-5 text-xs md:flex-row md:items-center md:justify-between">82          <p className="flex flex-wrap items-center gap-x-3 gap-y-1">83            <span>84              © {year} {site.brand.legalName}. Tous droits réservés.85            </span>86            {site.legalLinks.map((l) => (87              <Link88                key={l.href}89                href={l.href}90                className="hover:text-navy-900 rounded-sm underline-offset-4 hover:underline"91              >92                {l.label}93              </Link>94            ))}95            <ManageCookiesButton96              label={site.cookies.manageLabel}97              className="hover:text-navy-900 rounded-sm underline-offset-4 hover:underline"98            />99          </p>100          <p className="text-ink-700 font-semibold tracking-[0.14em] uppercase">101            {site.brand.footerSignature}102          </p>103        </div>104      </div>105    </footer>106  );107}108
Files · main
Menu

Theme