Overview

Global Navigation is the list of navigation links your users find on the side on every page in Hawkeye. It also includes the sign out and the switch layout button.

Divisions

Due to the the number of pages, page links should be grouped on similar categories when possible. The c-sidebar__nav__item--parent class should be applied to link categories.

The logo is positioned on the top and it also functions as the home / link, followed by the page navigation. At the bottom we find the Switch layout button and the user name showing a Sign out button on hover.

The switch layout

When a user wants more horizontal room for the content area they can click the switch layout button to convert the vertical sidebar navigation into a top bar horizontal one.

Mobile layout

The design adapts for small viewports, positioning at the top with a expandable menu button and the switch layout option is no longer available at small sizes.