component

TuxFooter

The unified institutional footer. Maroon marketing top + black legal strip in a single component, mirroring the shape every tti.tamu.edu / tamu.edu / pvamu.edu surface uses. Earlier we shipped this as three pieces (slim app footer, marketing footer, TAMUS legal subfooter) — collapsed into one because every shipped TTI surface needs the same anchor. The black legal strip is mandatory and not configurable — TAMUS lockup, tagline, and state-agency links are fixed per AggieUX policy.

canonical

Full institutional footer

The shape used on the style guide itself, on marcom landing pages, and on docs sites. Pass columns and social to populate the marketing top; the black legal strip below renders unconditionally.

(page content) 
<TuxFooter
  :columns="[
    { heading: 'State Resources', links: [...] },
    { heading: 'Policies',        links: [...] },
  ]"
  :social="[
    { icon: 'lucide:linkedin', label: 'LinkedIn', href: '...' },
    { icon: 'lucide:facebook', label: 'Facebook', href: '...' },
    ...
  ]"
>
  <template #preferences>
    <button @click="toggleHighContrast">High-contrast mode</button>
  </template>
</TuxFooter>

app dashboard

Slim — no marketing columns

Drop the columns and social props and the maroon top compresses to just the identity block (logo + name + address + phone). The right shape for app contexts where marketing-y link grids would feel out of place — Landscape dashboards, tti-ai-studio sessions.

(page content) 
<!-- Pass no columns / no social — you get the
     identity block + mandatory legal strip. -->
<TuxFooter />

props

Props

  • name — institution name. Defaults to TTI. Override for sibling-institution builds (PVAMU, Tarleton, WTAMU).
  • address — multi-line address (split on newlines).
  • phone — phone number, rendered as a tel: link. Pass null to hide.
  • logo — logo path. Defaults to /logo.svg; the component inverts it to render light-on-maroon.
  • logoSize — px width/height. Defaults to 80.
  • social — array of { icon, label, href }. Renders as a circular-button row beneath the address. Pass empty to hide.
  • columns — array of { heading, links: [{ label, href?, to? }] }. Two columns is canonical; three+ works on wide containers. Pass empty to hide.
  • year — © year. Defaults to current year.

Slot

  • #preferences — optional row beneath the state-agency links in the legal strip. Used in the style guide for the high-contrast toggle (per ADR-0006: accessibility-as-compliance).