440 lines
8.1 KiB
SCSS
440 lines
8.1 KiB
SCSS
:root{
|
|
--nav-headbg: #FFFFFF;
|
|
--sidebar-bg: #FFFFFF;
|
|
--headerbg: #FFFFFF;
|
|
}
|
|
|
|
//background for nav header
|
|
@each $name, $color in $theme_backgrounds {
|
|
[data-nav-headerbg="#{$name}"][data-theme-version="dark"],
|
|
[data-nav-headerbg="#{$name}"] {
|
|
@if $name != "color_1" {
|
|
--nav-headbg: #{$color};
|
|
.nav-header{
|
|
.logo-abbr{
|
|
path{
|
|
fill:$color;
|
|
stroke:$color;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
[data-nav-headerbg="color_2"],[data-nav-headerbg="color_3"],[data-nav-headerbg="color_4"],[data-nav-headerbg="color_5"],[data-nav-headerbg="color_6"],[data-nav-headerbg="color_7"],
|
|
[data-nav-headerbg="color_9"],[data-nav-headerbg="color_10"],[data-nav-headerbg="color_11"],[data-nav-headerbg="color_12"],[data-nav-headerbg="color_13"],[data-nav-headerbg="color_14"],
|
|
[data-nav-headerbg="color_15"]{
|
|
.nav-header .rect-primary-rect {
|
|
fill: #ffffff;
|
|
}
|
|
.nav-header{
|
|
.brand-logo{
|
|
.brand-title{
|
|
path{
|
|
fill:$white;
|
|
}
|
|
tspan{
|
|
fill:$white;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
//special work for color
|
|
[data-nav-headerbg="color_8"]{
|
|
.nav-header{
|
|
.brand-logo{
|
|
.brand-title{
|
|
path{
|
|
fill:$black;
|
|
}
|
|
tspan{
|
|
fill:$black;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//background for nav header
|
|
@each $name, $color in $theme_backgrounds {
|
|
[data-sidebarbg="#{$name}"][data-theme-version="dark"],
|
|
[data-sidebarbg="#{$name}"] {
|
|
@if $name != "color_1" {
|
|
--sidebar-bg: #{$color};
|
|
|
|
.menu-toggle .dlabnav .metismenu li > ul{
|
|
background:$color!important;
|
|
}
|
|
|
|
&[data-sidebar-style="mini"],
|
|
&[data-sidebar-style="modern"],
|
|
&[data-sidebar-style="compact"],
|
|
&[data-sidebar-style="icon-hover"][data-layout="horizontal"],
|
|
&[data-sidebar-style="full"][data-layout="horizontal"]
|
|
{
|
|
.dlabnav{
|
|
.metismenu li ul{
|
|
background-color: lighten($color: $color, $amount: 10%);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
[data-sidebarbg="color_2"],[data-sidebarbg="color_3"],[data-sidebarbg="color_4"],[data-sidebarbg="color_5"],[data-sidebarbg="color_6"],[data-sidebarbg="color_7"],
|
|
[data-sidebarbg="color_9"],[data-sidebarbg="color_10"],[data-sidebarbg="color_11"],[data-sidebarbg="color_12"],[data-sidebarbg="color_13"],[data-sidebarbg="color_14"],
|
|
[data-sidebarbg="color_15"]{
|
|
.dlabnav {
|
|
.metismenu {
|
|
a{
|
|
color:rgba($white,0.75);
|
|
}
|
|
ul a:before{
|
|
background:rgba($white,0.5);
|
|
}
|
|
li{
|
|
ul{
|
|
a{
|
|
&:hover,
|
|
&:focus,
|
|
&.mm-active {
|
|
color:$white;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
&>li{
|
|
&>a{
|
|
color:rgba($white,0.85);
|
|
i{
|
|
color:rgba($white,0.85);
|
|
}
|
|
}
|
|
&.mm-active{
|
|
&>a{
|
|
background:rgba($white,0.15);
|
|
color:$white;
|
|
i{
|
|
color:$white;
|
|
}
|
|
&:before{
|
|
background:$white;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.has-arrow:after{
|
|
border-color: rgba($white,0.85) transparent transparent rgba($white,0.85);
|
|
}
|
|
}
|
|
.header-info2{
|
|
background-color: rgba($black,0.15);
|
|
span{
|
|
color: $white;
|
|
}
|
|
}
|
|
.sidebar-info{
|
|
color: $white;
|
|
i{
|
|
color: $white!important;
|
|
}
|
|
}
|
|
}
|
|
.plus-box{
|
|
background-color: rgba($white,0.15);
|
|
}
|
|
.copyright{
|
|
color:$white;
|
|
strong{
|
|
color:$white;
|
|
}
|
|
}
|
|
&[data-sidebar-style="full"][data-layout="vertical"]{
|
|
.dlabnav {
|
|
.metismenu{
|
|
&>li{
|
|
&.mm-active{
|
|
&>a{
|
|
i{
|
|
color:$white;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
ul a::before{
|
|
background: rgba($white,0.25);
|
|
}
|
|
}
|
|
}
|
|
.menu-toggle .dlabnav .metismenu {
|
|
& > li.mm-active,
|
|
& > li:hover {
|
|
& > a {
|
|
background: rgba($white,0.15);
|
|
i{
|
|
color: $white;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
&[data-sidebar-style="mini"][data-layout="vertical"]{
|
|
.dlabnav .metismenu > li{
|
|
&.mm-active,
|
|
&:hover{
|
|
& > a i {
|
|
color: $white;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
&[data-sidebar-style="modern"],
|
|
&[data-sidebar-style="overlay"],
|
|
&[data-sidebar-style="icon-hover"][data-layout="vertical"],
|
|
&[data-layout="horizontal"]{
|
|
.dlabnav .metismenu > li{
|
|
&:hover,
|
|
&.mm-active{
|
|
& > a{
|
|
color: $white;
|
|
i{
|
|
color: $white;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
&[data-sidebar-style="icon-hover"][data-layout="vertical"]{
|
|
.dlabnav .metismenu > li{
|
|
&:hover,
|
|
&.mm-active{
|
|
& > a{
|
|
background-color: rgba($white,0.15);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
&[data-sidebar-style="compact"][data-layout="vertical"]{
|
|
.dlabnav {
|
|
.metismenu {
|
|
&>li {
|
|
a{
|
|
&:hover{
|
|
color:$white;
|
|
}
|
|
}
|
|
&>a{
|
|
&>i{
|
|
background: rgba($white,0.15)!important;
|
|
color:rgba($white,0.7);
|
|
}
|
|
}
|
|
&.mm-active,&:hover{
|
|
&>a {
|
|
box-shadow:none;
|
|
background:transparent!important;
|
|
color:$white!important;
|
|
i{
|
|
background: rgba($white,0.15)!important;
|
|
color:$white!important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
&[data-sidebar-style="mini"],
|
|
&[data-sidebar-style="modern"],
|
|
&[data-sidebar-style="compact"],
|
|
&[data-sidebar-style="icon-hover"][data-layout="horizontal"],
|
|
&[data-sidebar-style="full"][data-layout="horizontal"]
|
|
{
|
|
.dlabnav .metismenu > li.mm-active > a,
|
|
.dlabnav .metismenu > li:hover > a{
|
|
background:rgba($white,0.15)!important;
|
|
}
|
|
}
|
|
}
|
|
//special work for color
|
|
[data-sidebarbg="color_8"]{
|
|
.dlabnav .metismenu ul a:before {
|
|
background:rgba($black,0.5);
|
|
}
|
|
.dlabnav {
|
|
.metismenu{
|
|
a{
|
|
color:rgba($black,0.6)!important;
|
|
&:hover,
|
|
&:focus,
|
|
&.mm-active {
|
|
color:$black!important;
|
|
}
|
|
}
|
|
.has-arrow:after{
|
|
border-color: rgba(0,0,0,0.5) transparent transparent rgba(0,0,0,0.5);
|
|
}
|
|
&>li{
|
|
&>a{
|
|
color:rgba($black,0.6)!important;
|
|
i{
|
|
color:rgba($black,0.6)!important;
|
|
}
|
|
}
|
|
&.mm-active{
|
|
&>a{
|
|
background:rgba($black,0.1)!important;
|
|
&:before{
|
|
background:rgba($black,0.6)!important;
|
|
}
|
|
|
|
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.copyright p{
|
|
color:rgba($black,0.6);
|
|
}
|
|
.book-box{
|
|
background: rgba($black,0.4);
|
|
}
|
|
.header-info2 {
|
|
background-color: rgba($black,0.05);
|
|
span{
|
|
color: $text-dark;
|
|
}
|
|
}
|
|
.sidebar-info{
|
|
color: rgba($black,0.6);
|
|
i{
|
|
color: rgba($black,0.6)
|
|
}
|
|
}
|
|
}
|
|
.plus-box{
|
|
background-color:rgba($black,0.4);
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
//background for nav header
|
|
@each $name, $color in $theme_backgrounds {
|
|
[data-headerbg="#{$name}"][data-theme-version="dark"],
|
|
[data-headerbg="#{$name}"] {
|
|
@if $name != "color_1" {
|
|
--headerbg: #{$color};
|
|
|
|
.header-right{
|
|
.notification_dropdown .nav-link {
|
|
.badge{
|
|
color: $color!important;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
|
|
}
|
|
}
|
|
}
|
|
|
|
[data-headerbg="color_2"],[data-headerbg="color_3"],[data-headerbg="color_4"],[data-headerbg="color_5"],[data-headerbg="color_6"],[data-headerbg="color_7"],
|
|
[data-headerbg="color_9"],[data-headerbg="color_10"],[data-headerbg="color_11"],[data-headerbg="color_12"],[data-headerbg="color_13"],[data-headerbg="color_14"],
|
|
[data-headerbg="color_15"]{
|
|
.search-area .input-group-text,
|
|
.search-area .form-control,.search-area .form-control::placeholder{
|
|
color:$white;
|
|
}
|
|
.search-area .input-group-append .input-group-text i{
|
|
color:$white;
|
|
}
|
|
.header-profile > a.nav-link .header-info small, .header-profile > a.nav-link .header-info span{
|
|
color:$white;
|
|
}
|
|
.hamburger .line{
|
|
background:$white!important;
|
|
}
|
|
.header-left{
|
|
.search-area .form-control,
|
|
.search-area .input-group-text{
|
|
background-color: rgba($white,0.15);
|
|
i{
|
|
color:$white;
|
|
}
|
|
}
|
|
.dashboard_bar{
|
|
color:$white;
|
|
}
|
|
.plus-icon a{
|
|
background-color: rgba($white,0.15);
|
|
color: $white;
|
|
}
|
|
|
|
}
|
|
.header-right{
|
|
svg{
|
|
path{
|
|
fill:$white;
|
|
}
|
|
}
|
|
#icon-dark{
|
|
color:$white;
|
|
}
|
|
.notification_dropdown .nav-link {
|
|
.badge{
|
|
background-color: $white!important;
|
|
}
|
|
svg path{
|
|
fill: $white;
|
|
}
|
|
}
|
|
.nav-item .nav-link{
|
|
color: $white;
|
|
}
|
|
}
|
|
}
|
|
|
|
//special work for color
|
|
[data-headerbg="color_8"]{
|
|
.search-area .input-group-text,
|
|
.search-area .form-control,.search-area .form-control::placeholder{
|
|
color:$black;
|
|
background:#F1F1F1;
|
|
}
|
|
.header-left{
|
|
.search-area .form-control,
|
|
.search-area .input-group-text{
|
|
i{
|
|
color:$black;
|
|
}
|
|
}
|
|
.dashboard_bar{
|
|
color:$black;
|
|
}
|
|
|
|
}
|
|
.hamburger .line{
|
|
background:$black;
|
|
}
|
|
|
|
.header-right{
|
|
svg{
|
|
path{
|
|
fill:rgba($black,0.4);
|
|
}
|
|
}
|
|
}
|
|
} |