/* * Component: Sidebar * ------------------ */ //Main Sidebar .main-sidebar { position: absolute; top: $main-header-height; left: 0; @include calc("min-height", "100% - #{$main-header-height}"); z-index: 810; width: $sidebar-width; transition: transform $transition-speed $transition-fn, width $transition-speed $transition-fn; .layout-fixed & { height: 100%; overflow-y: auto; padding-bottom: 55px; } /*@include media-breakpoint-down(md) { @include translate(-$sidebar-width, 0); } .sidebar-collapse & { @include media-breakpoint-up(md) { @include translate(-$sidebar-width, 0); } } .sidebar-open & { @include media-breakpoint-down(md) { @include translate(0, 0); } }*/ } .sidebar { padding-bottom: 10px; } //Sidebar user panel .user-panel { position: relative; width: 100%; padding: 10px; overflow: hidden; @include clearfix(); > .image > img { width: 100%; max-width: 45px; height: auto; } > .info { padding: 5px 5px 5px 15px; line-height: 1; position: absolute; left: 55px; > p { font-weight: 600; margin-bottom: 9px; } > a { text-decoration: none; padding-right: 5px; margin-top: 3px; font-size: 11px; > .fa, > .ion, > .glyphicon { margin-right: 3px; } } } } // Sidebar menu .nav-sidebar { //First Level > .nav-item { > .nav-link { @include border-radius(0); > .nav-icon { width: 20px; } } .pull-right { margin-top: 3px; margin-right: 5px; } } .nav-header { padding: $nav-link-padding; font-size: .85em; } // All other levels .nav-link > .fa-angle-left { width: auto; height: auto; padding: 0; margin-right: 10px; margin-top: 3px; } .nav-item.active { > .nav-link { font-weight: $display1-weight; } > .nav-link > .fa-angle-left { @include rotate(-90deg); } > .nav-treeview { display: block; } } // Tree view menu .nav-treeview { display: none; list-style: none; padding: 0; margin: 0; padding-left: 5px; .nav-treeview { padding-left: 20px; } > .nav-item { margin: 0; > .nav-link { padding: 5px 5px 5px 15px; display: block; font-size: 14px; > .nav-icon { width: 20px; } } } } }