Documentation
Orbit
< Menu

Sidebar

### Description
Loads all the sidebar widgets. Each widget to be loaded in the sidebar needs to conform to some basic information that is read and displayed by this widget.

### CSS/SASS Variables
*Dependencies are included and configured as part of the provided Update Set.*

| Variable | Comments |
| -------- |:---|
| `$orbit-sidebar-bg: $navbar-inverse-bg !default;` | Background color of the sidebar. |
| `$orbit-sidebar-width: 260px !default;` | Width of the sidebar. |
| `$orbit-sidebar-offset-top: 60px !default;` | Offset to account for the height of the menu above it. |
| `$orbit-sidebar-offset-top-xs: $orbit-sidebar-offset-top !default;` | Offset to account for the height of the menu above it in extra small screens. |
| `$orbit-sidebar-veil-color: rgba(0, 0, 0, .4) !default;` | The color of the veil which appears when the sidebar is in small screens. |
| `$orbit-sidebar-transition: all 0.25s ease-in-out !default;` | The default sidebar transition. |
| `$orbit-sidebar-breakpoint: $grid-float-breakpoint !default;` | Unused. |
| `$orbit-sidebar-breakpoint-max: ($orbit-sidebar-breakpoint - 1) !default;` | The breakpoint at which the sidebar becomes fixed. |
| `$orbit-sidebar-default-open: true !default;` | The variable to decide whether the sidebar should be open by default in small screens. |
| `$orbit-sidebar-location: left !default;` | The variable to decide which side the sidebar should show from. |
| `$orbit-sidebar-border: $navbar-default-border !default;` | The default sidebar border. |

Want to Learn More? Talk to an Expert
Contact Us