# Sidebar

Sidebar is simple container for sidebar items. It consists of Sidebar and SidebarContentOverlay components.

<Sidebar> and <SidebarContentOverlay> components should be added to your root element (in default project: App.vue). Inside <Sidebar> you should put your sidebar links, etc. <SidebarContentOverlay> is used as transparent black overlay which is displayed on mobile devices and when clicked on closes the sidebar.

You can control the visibility of sidebar by using global this.$sidebar.open(), this.$sidebar.close() or this.$sidebar.toggle() methods which are available in any component instance.

By default, on mobile and small devices sidebar is initially closed.