CSS
Use these classes to create a sidenav component. It must be a child of .main-container and a sibling after .content-area.
Classes
CSS Class | Host Element(s) | Type | Description | Required |
---|---|---|---|---|
.sidenav | nav | layout | A navigation element for the sidenav content. | yes |
.sidenav-content | div | layout | A container element for one or more .nav-group elements | yes |
.nav-group | section | layout | An element used to create a collapsible container of nav links. | yes |
.collapsible | section | When composed with .nav-group it makes the section expand and collapse. | no | |
.nav-list | ul | layout | A list of navigation links. | yes |
.nav-link | li | style | An element used to designate navigation for an application. | yes |
.active | li | style | When composed with .nav-link it visually indicates the active navigation element in the sidnav. | yes - only on one .nav-link at a time. |