spb/company-atlas

1import Link from 'next/link';2import { Wordmark } from '@/components/brand/logo';3import { AUTHOR_NAME, CONTACT_EMAIL, footerGroups, HOST_NAME, HOST_URL, SITE_URL } from '@/lib/site';45const HOST_LABEL = HOST_URL.replace(/^https?:\/\//, '');67export function SiteFooter() {8  return (9    <footer className="mt-16 border-t border-rule">10      <div className="container-x mx-auto max-w-[1600px] py-10">11        <div className="grid gap-8 md:grid-cols-[1.6fr_1fr_1fr_1fr]">12          <div>13            <Link href="/" className="inline-flex" aria-label="Company Atlas home">14              <Wordmark markSize={22} textClassName="text-[16px]" />15            </Link>16            <p className="mt-3 max-w-sm text-sm leading-relaxed text-ink-2">17              A continuously updated corporate observation network. Every event links to the public page where it was detected; inferred facts carry a confidence label; history is never overwritten.18            </p>19            <p className="mono mt-3 text-xs text-ink-3">{SITE_URL.replace(/^https?:\/\//, '')}/api/v1</p>20          </div>21          {footerGroups.map((g) => (22            <div key={g.label}>23              <p className="eyebrow mb-2">{g.label}</p>24              <ul className="space-y-1 text-sm">25                {g.items.map((n) => (26                  <li key={n.href + n.label}>27                    {n.href.startsWith('mailto:') ? (28                      <a href={n.href} className="inline-block py-0.5 text-ink-2 hover:text-ink">29                        {n.label}30                      </a>31                    ) : (32                      <Link href={n.href} className="inline-block py-0.5 text-ink-2 hover:text-ink">33                        {n.label}34                      </Link>35                    )}36                  </li>37                ))}38              </ul>39            </div>40          ))}41        </div>42        <div className="mt-10 flex flex-col gap-3 border-t border-rule pt-5 text-[13px] leading-relaxed text-ink-2 md:flex-row md:items-start md:justify-between md:gap-8">43          {/* explicit spaces around the separators give the line break opportunities on narrow screens */}44          <p className="md:max-w-[60%]" data-credits>45            <span className="whitespace-nowrap">46              Built by <span className="font-medium text-ink">{AUTHOR_NAME}</span>47            </span>{' '}48            <span className="text-ink-3">·</span>{' '}49            <a href={`mailto:${CONTACT_EMAIL}`} className="underline decoration-rule-strong underline-offset-[3px] hover:text-ink hover:decoration-ink">50              {CONTACT_EMAIL}51            </a>{' '}52            <span className="text-ink-3">·</span>{' '}53            <span className="whitespace-nowrap">54              Hosted on{' '}55              <a href={HOST_URL} target="_blank" rel="noopener noreferrer" className="font-medium text-ink hover:underline">56                {HOST_NAME}57              </a>58            </span>{' '}59            <span className="text-ink-3">—</span>{' '}60            <a href={HOST_URL} target="_blank" rel="noopener noreferrer" className="mono text-[12.5px] hover:text-ink">61              {HOST_LABEL}62            </a>63          </p>64          <p className="max-w-xl text-ink-3 md:text-right">Data provenance: observations of publicly accessible corporate web pages, collected by CompanyAtlasBot in accordance with robots.txt. Interpretations are labelled, never asserted as fact.</p>65        </div>66      </div>67    </footer>68  );69}70