@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.
14 lines (9 loc) • 701 B
Markdown
<!-- @license CC0-1.0 -->
# Tab Navigation
A horizontal or vertical list of links, styled as tabs, to navigate between a set of related pages.
## Guidelines
- Use Tab Navigation for navigating between pages that each have their own main content.
Thanks to using links, every tab’s content has its own url that the user can open in a new window, share, or bookmark.
- Use [Tabs](https://designsystem.amsterdam/?path=/docs/components-containers-tabs--docs) instead to switch between small pieces of secondary content without navigating away.
- Use the vertical orientation to stack links below each other, e.g. in a sidebar.
- Add `aria-current="page"` to the link pointing to the current page.