@amsterdam/design-system-css
Version:
Stylesheets for all components from the Amsterdam Design System and some general utilities. Use it to apply the visual design of the City of Amsterdam to your HTML elements or non-React components.
26 lines (18 loc) • 1.3 kB
Markdown
<!-- @license CC0-1.0 -->
# Page Footer
Provides service information at the bottom of every page.
## Guidelines
- The Page Footer must be used on all websites and applications for the City of Amsterdam.
- It usually consists of two sections: a full-width blue `PageFooter.Spotlight` and a `PageFooter.Menu` below it.
- `Footer.Menu` is preceded by a visually hidden `Heading` for accessibility.
- A Page Footer containing only a `PageFooter.Menu` can be sufficient for applications.
- The Page Footer must be used on all websites for the City of Amsterdam.
- It must be the same on every page.
- Set [the inverse colour](?path=/docs/brand-design-tokens-colour--docs#pairing-foreground-with-background-colours) on all text and links in this area.
The top section offers space for various practical links:
- The first column focuses on contact information.
The information is as specific as possible and tailored to the respective website or page (e.g., including a chat option if available).
- The second column contains links to relevant (online) sites or sources.
- The third column refers to newsletters, social media, etc.
The menu in the bottom section is for links to privacy policies, cookie statements, information about the website itself, etc.
Contact details should not go here.