Sidebar
A sidebar hides additional content beside a page.

Types

Sidebar

A sidebar.

States

Visible

A sidebar can be visible on the page.

Dimmed

A pusher can be dimmed.

Examples

Transitions

Not all sidebar Transitions are available for every sidebar direction, or when multiple sidebars are visible at a time.

Multiple VisibleSupports Vertical SidebarsSupports Horizontal Sidebars
Overlay
Push
Scale Down
Uncover
Slide Along
Slide Out

Displaying Multiple

Multiple sidebars can be displayed at the same time only when using a supported animation likepush or overlay.

Usage

Callbacks

A sidebar can have callbacks.

Target

A sidebar can handle clicks on the passed element.

This is the bottom