Prototype Library

Link Column

A footer / sitemap / mega-menu column: heading + thin rule + a list of links. Inherits currentColor (the rule is derived from it), so it reads on a brand footer or a light surface without carrying brand values.

Inherited .astro import EsaLinkColumn from '@esa/ecology/esa-link-column.astro';

On a light surface

Mitigation work
  • Projects
  • Contracts
  • Portfolios
  • Work elements
  • Estuary program
  • Tributary habitat
Reporting
  • Report Center
  • Programs
  • Maps
  • Publications
<EsaLinkColumn heading="Mitigation work" links={[{ label: 'Projects' }, …]} />

On a brand surface (currentColor)

Mitigation work
  • Projects
  • Contracts
  • Portfolios
  • Work elements
  • Estuary program
  • Tributary habitat
Reporting
  • Report Center
  • Programs
  • Maps
  • Publications
<div style="background:var(--color-background-brand);color:#fff">
  <EsaLinkColumn heading="Mitigation work" links={[…]} />
</div>

API

PropTypeDefaultDescription
heading string required Column heading.
href string — Optional link on the heading itself.
links LinkItem[] required The list of links.