Navigation
Footer
The quiet line at the bottom of a page: who makes Makado, and the legal links.
Preview
Props
| Prop | Type | Description |
|---|---|---|
children | React.ReactNode | |
links | { label: string; href: string; onClick?: (e: React.MouseEvent<HTMLAnchorElement>) => void }[] | With onClick, the link opens something in place (a modal) and the href stays as the fallback. |
linksLabel | string | |
align | 'start' | 'center' | |
className | string |
Guidelines
The quiet line at the bottom of a page: who makes Makado, and the legal links.
Provide: the line as children and links ({ label, href }).
- In the app, sign in, Terms and Privacy it reads "© 2026 Roger Seng Studios", with the studio name linking to https://rogerseng.me (underlined, so it reads as a link without color), and links to Terms (
/terms) and Privacy (/privacy). - 12px,
subdued, so it holds 4.5:1 on the backdrop in both themes and never competes with the page. Links aresubduedand bold, underlined on hover, with a focus ring. align: centerfor single-column pages such as sign in.- Sits after the last panel of the page, above the phone tab bar on phones.
- A link can open something in place: give it
onClick(the app opens Terms and Privacy in a modal sheet), and itshrefstays as the fallback for a new tab or no JavaScript.