Skip to main content

Sidebars

A sidebar is a complementary component in your app, and it has an App Bar of its own on top, and elements below it. It also has a obligatory Sidebar Title using View Title typography rules.

When using one, the app's Main Menu (1) goes here, on the right position of the App Bar of the Sidebar. When there's a Sidebar in an app, other App Bars have the view-more symbolic icon (2) instead, as they're Complementary Menus, that act on that side of the app, and not the app as a whole.

The Main Search of the app goes here if your app has a Sidebar, below the Sidebar Title.

  • Elements on the sidebar have 18dp spacing on the sides.
  • The Main Search has 12dp spacing on top and on bottom.
  • Elements below the Sidebar have 6dp spacing between them, irregardless if they're Items or Mini Content Blocks.

Secondary Sidebar​

If one Sidebar isn't enough, you can add no more than one Sidebar, this being the Secondary Sidebar. This Sidebar doesn't have a Search widget, only a Sidebar Title and elements. This Sidebar, if it has a Menu, uses the Secondary Menu visuals.