106 lines
2.4 KiB
Plaintext
106 lines
2.4 KiB
Plaintext
/* ==============================================
|
|
Sidebar Actions
|
|
A. Sidebar Left Toggle
|
|
B. Sidebar Right Toggle
|
|
C. Left Sidebar Minified Helper
|
|
D. Mobile Menu Modifications
|
|
=================================================
|
|
A. Sidebar Left Toggle
|
|
================================================= */
|
|
|
|
/*left sidebar open*/
|
|
.sb-l-o #sidebar_left {
|
|
left: 0;
|
|
overflow: hidden;
|
|
}
|
|
.sb-l-o #content_wrapper {
|
|
margin-left: @sidebar-open-width;
|
|
}
|
|
|
|
/*left sidebar closed*/
|
|
.sb-l-c #sidebar_left {
|
|
left: -(@sidebar-open-width);
|
|
overflow: hidden;
|
|
}
|
|
.sb-l-c #content_wrapper {
|
|
margin-left: 0;
|
|
}
|
|
|
|
/* Adjust navbar branding when closed */
|
|
.sb-l-c .navbar-branding {
|
|
width: @sidebar-minified-width;
|
|
}
|
|
.sb-l-c .navbar-brand {
|
|
display: none;
|
|
}
|
|
|
|
/*====================================================
|
|
B. Sidebar Right Toggle
|
|
====================================================== */
|
|
|
|
/*Sidebar Right Open */
|
|
.sb-r-o #sidebar_right {
|
|
right: 0;
|
|
}
|
|
.sb-r-o #content_wrapper {
|
|
margin-right: 300px;
|
|
}
|
|
|
|
/*Sidebar Right Closed*/
|
|
.sb-r-c #sidebar_right {
|
|
right: -300px;
|
|
}
|
|
.sb-r-c #content_wrapper {
|
|
margin-right: 0;
|
|
}
|
|
|
|
/*====================================================
|
|
C. Left Sidebar Minified Helper
|
|
====================================================== */
|
|
.sb-l-c.sb-l-m #sidebar_left {
|
|
left: -(@sidebar-minified-width);
|
|
}
|
|
|
|
/*hide sidebar user menu button when the sidebar is
|
|
collapsed. As it's not accessible in this mode*/
|
|
.sb-l-m .navbar .sidebar-menu-toggle,
|
|
.sb-l-c .navbar .sidebar-menu-toggle {
|
|
margin-left: 10px;
|
|
display: none;
|
|
}
|
|
|
|
/*===============================================
|
|
D. Mobile Menu Modifications
|
|
================================================= */
|
|
|
|
/* At less than 1100px we collapse any open sidebars via
|
|
Media Queries. Theme Javscript will also add a a
|
|
".mobile-view" class so that you can do any needed
|
|
manipulation using an html class aswell */
|
|
@media (max-width: 1100px) {
|
|
|
|
/* Sidebar Left Open/Default */
|
|
#content_wrapper,
|
|
.sb-l-o #content_wrapper {
|
|
margin-left: 0;
|
|
left: @sidebar-open-width;
|
|
}
|
|
|
|
/* Sidebar Left Minified */
|
|
.sb-l-m #content_wrapper {
|
|
left: 0;
|
|
}
|
|
|
|
/* Sidebar Left Closed */
|
|
.sb-l-c #content_wrapper {
|
|
margin-left: 0;
|
|
left: 0;
|
|
}
|
|
|
|
/* Sidebar Right Open */
|
|
.sb-r-o #content_wrapper {
|
|
margin-right: 0;
|
|
left: -300px;
|
|
}
|
|
}
|