Underline nav
The underline nav is used to display navigation in a horizontal tabbed format.
On this page
v0.36.1AlphaNot reviewed for accessibility
Description
Use UnderlineNav
to style navigation links with a minimal
underlined selected state, typically placed at the top
of the page.
For panel navigation, use UnderlinePanels instead.
Accessibility
- By default,
UnderlineNav
renders links within a<nav>
element.<nav>
has an implicit landmark role ofnavigation
which should be reserved for main links. For all other set of links, set tag to:div
. - See
Primer::Alpha::Navigation::Tab
for additional accessibility considerations.
Arguments
Name | Type | Default | Description |
---|---|---|---|
tag | Symbol |
| One of |
label | String | N/A | Sets an |
align | Symbol |
| One of |
body_arguments | Hash |
| System arguments for the body wrapper. |
system_arguments | Hash | N/A |
Examples
Slots
tabs
Use the tabs to list page links.
Name | Type | Default | Description |
---|---|---|---|
selected | Boolean | N/A | Whether the tab is selected. |
system_arguments | Hash | N/A |
actions
Use actions for a call to action.
Name | Type | Default | Description |
---|---|---|---|
tag | Symbol |
| One of |
system_arguments | Hash | N/A |