158 lines
4.1 KiB
SCSS
158 lines
4.1 KiB
SCSS
@use "sass:color";
|
|
|
|
@use "../vars/vars";
|
|
@use "../vars/vars-night";
|
|
|
|
.ve-night-mode .fltr {
|
|
$flt-ignore: vars-night.$rgb-bg--night;
|
|
$flt-ignore--hover: #323232;
|
|
|
|
&__ {
|
|
&btn_nest {
|
|
background: $flt-ignore;
|
|
border-color: vars-night.$rgb-border-grey--night;
|
|
|
|
&:hover {
|
|
background: $flt-ignore--hover;
|
|
}
|
|
|
|
&--include {
|
|
background: repeating-linear-gradient(135deg, vars.$rgb-active-blue, vars.$rgb-active-blue vars.$fltr-stripe, transparent vars.$fltr-stripe, transparent vars.$fltr-2stripe);
|
|
|
|
&:hover {
|
|
background: repeating-linear-gradient(135deg, color.adjust(vars.$rgb-active-blue, $lightness: - vars.$pct-darken-hover), color.adjust(vars.$rgb-active-blue, $lightness: - vars.$pct-darken-hover) vars.$fltr-stripe, transparent vars.$fltr-stripe, transparent vars.$fltr-2stripe);
|
|
}
|
|
|
|
span {
|
|
background: vars-night.$rgb-bg--night;
|
|
}
|
|
}
|
|
|
|
&--include-all {
|
|
background: vars.$rgb-active-blue;
|
|
|
|
&:hover {
|
|
background: color.adjust(vars.$rgb-active-blue, $lightness: - vars.$pct-darken-hover);
|
|
}
|
|
}
|
|
|
|
&--exclude {
|
|
background: repeating-linear-gradient(135deg, transparent, transparent vars.$fltr-stripe, vars.$rgb-active-red vars.$fltr-stripe, vars.$rgb-active-red vars.$fltr-2stripe);
|
|
|
|
&:hover {
|
|
background: repeating-linear-gradient(135deg, transparent, transparent vars.$fltr-stripe, color.adjust(vars.$rgb-active-red, $lightness: - vars.$pct-darken-hover) vars.$fltr-stripe, color.adjust(vars.$rgb-active-red, $lightness: - vars.$pct-darken-hover) vars.$fltr-2stripe);
|
|
}
|
|
|
|
span {
|
|
background: vars-night.$rgb-bg--night;
|
|
}
|
|
}
|
|
|
|
&--exclude-all {
|
|
background: vars.$rgb-active-red;
|
|
|
|
&:hover {
|
|
background: color.adjust(vars.$rgb-active-red, $lightness: - vars.$pct-darken-hover);
|
|
}
|
|
}
|
|
|
|
&--both {
|
|
background: repeating-linear-gradient(135deg, vars.$rgb-active-blue, vars.$rgb-active-blue vars.$fltr-stripe, vars.$rgb-active-red vars.$fltr-stripe, vars.$rgb-active-red vars.$fltr-2stripe);
|
|
|
|
&:hover {
|
|
background: repeating-linear-gradient(135deg, color.adjust(vars.$rgb-active-blue, $lightness: - vars.$pct-darken-hover), color.adjust(vars.$rgb-active-blue, $lightness: - vars.$pct-darken-hover) vars.$fltr-stripe, color.adjust(vars.$rgb-active-red, $lightness: - vars.$pct-darken-hover) vars.$fltr-stripe, color.adjust(vars.$rgb-active-red, $lightness: - vars.$pct-darken-hover) vars.$fltr-2stripe);
|
|
}
|
|
}
|
|
}
|
|
|
|
&dropdown-divider {
|
|
border-color: vars-night.$rgb-border-grey--night;
|
|
|
|
@media screen and (width <= #{vars.$width-screen-sm}) {
|
|
box-shadow: inset 0 0 2px 2px vars.$rgb-off-black;
|
|
background: vars-night.$rgb-border-grey--night;
|
|
}
|
|
}
|
|
|
|
&dropdown-divider--sub {
|
|
border-color: vars-night.$rgb-border-grey--trans-night;
|
|
}
|
|
|
|
&pill {
|
|
border-color: vars-night.$rgb-border-grey--night;
|
|
|
|
&[state="ignore"] {
|
|
background: $flt-ignore;
|
|
|
|
&:hover {
|
|
background: $flt-ignore--hover;
|
|
}
|
|
}
|
|
|
|
&[state="yes"] {
|
|
border-color: color.adjust(vars.$rgb-active-blue, $lightness: - vars.$pct-darken-border);
|
|
}
|
|
|
|
&[state="no"] {
|
|
border-color: color.adjust(vars.$rgb-active-red, $lightness: - vars.$pct-darken-border);
|
|
}
|
|
|
|
&--muted {
|
|
color: color.adjust(vars.$rgb-font--muted, $lightness: - 7%);
|
|
|
|
&[state="yes"],
|
|
&[state="no"] {
|
|
color: #fff;
|
|
}
|
|
}
|
|
}
|
|
|
|
&mini-view {
|
|
border-color: vars-night.$rgb-border-grey--night;
|
|
background: linear-gradient(to top, vars-night.$rgb-border-grey--night, #343434 1px);
|
|
}
|
|
|
|
&h-btn-logic--blue {
|
|
color: vars.$rgb-active-blue;
|
|
|
|
&:hover {
|
|
color: vars.$rgb-active-blue--light;
|
|
}
|
|
}
|
|
|
|
&h-btn-logic--red {
|
|
color: vars.$rgb-active-red;
|
|
|
|
&:hover {
|
|
color: vars.$rgb-active-red--light;
|
|
}
|
|
}
|
|
}
|
|
|
|
&-search__ {
|
|
&wrp-row {
|
|
&:focus,
|
|
&:hover {
|
|
background-color: color.adjust(vars-night.$rgb-bg--night, $lightness: 2%);
|
|
}
|
|
}
|
|
|
|
&wrp-values {
|
|
background-color: vars-night.$rgb-bg--night;
|
|
border-color: vars-night.$rgb-border-grey--night;
|
|
}
|
|
}
|
|
|
|
&-src__ {
|
|
&wrp-slider {
|
|
background: #333a;
|
|
}
|
|
}
|
|
|
|
&-cls__ {
|
|
&tgl {
|
|
@include vars-night.mix-cb-custom--night;
|
|
}
|
|
}
|
|
}
|