Components/Side Navigation

The Side Navigation is an additional option to add a navigation to an application. Same as the vertical navigation it offers the user easy access to multiple pages per space. Side Navigation is triggered by the Menu Icon in Shellbar and can be hidden, collapsed or expanded.

The Side Navigation consists of the following elements: **.fd-side-nav**: navigation container. **.is-collapsed** class is added for collapsed state. **.fd-side-nav\\_\\_container** with modifier classes **.fd-side-nav\\_\\_container--top** for the main navigation and **.fd-side-nav\\_\\_container--bottom** for the footer navigation. **.fd-side-nav\\_\\_separator** separator between the main and footer area. The List structure is based on **Navigation List** **.fd-navigation-list** with modifier classes **.level-1** and **.level-2** **.fd-navigation-list\\_\\_item** **.fd-navigation-list\\_\\_item--group** **.fd-navigation-list\\_\\_item--quick-create** **.fd-navigation-list\\_\\_item--two-click** **.fd-navigation-list\\_\\_content** **.fd-navigation-list\\_\\_content-container** **.fd-navigation-list\\_\\_icon** **.fd-navigation-list\\_\\_text** **.fd-navigation-list\\_\\_navigation-indicator** **.fd-navigation-list\\_\\_indication-arrow**