Site Footer

v0.2.0
Draft

Site footer with a brand, grouped navigation links, free content and a legal line; the groups stack on small screens and sit in columns from the medium breakpoint.

pnpm add @behivetech/organisms.site-footer

This is the snapshot of v0.2.0, the current version, as recorded on 2026-11-10. The live page runs its examples →

Examples of v0.2.0 are shown as code; only the latest version runs live. Open the live examples →

A footer with a brand, three link groups, contact content and a legal line.

Basic Site Footer
1const BasicSiteFooter = () => (
2  <SiteFooter
3    brand="The BEhive"
4    legal="© 2026 The BEhive"
5    groups={[
6      {
7        title: "Your stay",
8        links: [
9          { label: "House guide", href: "#guide" },
10          { label: "Wifi", href: "#wifi" },
11        ],
12      },
13      { title: "Art", links: [{ label: "The artists", href: "#artists" }] },
14    ]}
15  >
16    <a href="mailto:hello@example.com">hello@example.com</a>
17  </SiteFooter>
18);
19

20render(<BasicSiteFooter />);

Without groups the footer shows only the brand and the legal line.

Brand Only Site Footer
1const BrandOnlySiteFooter = () => (
2  <SiteFooter brand="The BEhive" legal="© 2026 The BEhive" />
3);
4

5render(<BrandOnlySiteFooter />);