AdminLTE/scss/mixins/_nav-treeview-dark.scss

87 lines
1.7 KiB
SCSS

@mixin nav-treeview-dark(
$sidebar-bg,
$sidebar-hover-bg,
$sidebar-color,
$sidebar-hover-color,
$sidebar-active-color,
$sidebar-submenu-bg,
$sidebar-submenu-color,
$sidebar-submenu-hover-color,
$sidebar-submenu-hover-bg,
$sidebar-submenu-active-color,
$sidebar-submenu-active-bg
) {
// Sidebar background color
background-color: $sidebar-bg;
// Sidebar Menu. First level links
.nav-sidebar > .nav-item {
// links
> .nav-link {
// border-left: 3px solid transparent;
&:active {
color: $sidebar-color;
}
}
// Hover and active states
&.menu-open > .nav-link,
&:hover > .nav-link,
> .nav-link:focus {
background-color: $sidebar-hover-bg;
color: $sidebar-hover-color;
}
> .nav-link.active {
color: $sidebar-hover-color;
}
// First Level Submenu
> .nav-treeview {
background-color: $sidebar-submenu-bg;
}
}
// Section Heading
.nav-header {
background-color: inherit; //darken($sidebar-bg, 3%);
color: tint-color($sidebar-color, 5%);
}
// All links within the sidebar menu
.sidebar {
a {
color: $sidebar-color;
&:hover,
&:focus {
text-decoration: none;
}
}
}
// All submenus
.nav-treeview {
> .nav-item {
> .nav-link {
color: $sidebar-submenu-color;
&:hover,
&:focus {
background-color: $sidebar-submenu-hover-bg;
color: $sidebar-submenu-hover-color;
}
}
> .nav-link.active {
&,
&:hover,
&:focus {
background-color: $sidebar-submenu-active-bg;
color: $sidebar-submenu-active-color;
}
}
}
}
}