White checkboxes variable
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
This commit is contained in:
parent
a0d268d7a1
commit
27a6bbcd8a
|
@ -255,35 +255,36 @@ input {
|
||||||
background-image: url('../img/actions/checkbox-mixed.svg');
|
background-image: url('../img/actions/checkbox-mixed.svg');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
$color-checkbox-white: #fff;
|
||||||
&.radio--white,
|
&.radio--white,
|
||||||
&.checkbox--white {
|
&.checkbox--white {
|
||||||
+ label:before,
|
+ label:before,
|
||||||
&:focus + label:before {
|
&:focus + label:before {
|
||||||
border-color: darken(#fff, 27%);
|
border-color: darken($color-checkbox-white, 27%);
|
||||||
}
|
}
|
||||||
&:not(:disabled):not(:checked) + label:hover:before {
|
&:not(:disabled):not(:checked) + label:hover:before {
|
||||||
border-color: #fff;
|
border-color: $color-checkbox-white;
|
||||||
}
|
}
|
||||||
&:checked + label:before {
|
&:checked + label:before {
|
||||||
box-shadow: inset 0px 0px 0px 2px $color-main-background;
|
box-shadow: inset 0px 0px 0px 2px $color-main-background;
|
||||||
background-color: darken(#fff, 14%);
|
background-color: darken($color-checkbox-white, 14%);
|
||||||
border-color: darken(#fff, 14%);
|
border-color: darken($color-checkbox-white, 14%);
|
||||||
}
|
}
|
||||||
&:disabled + label:before {
|
&:disabled + label:before {
|
||||||
background-color: darken(#fff, 27%) !important; /* override other status */
|
background-color: darken($color-checkbox-white, 27%) !important; /* override other status */
|
||||||
border-color: rgba(#fff, 0.4) !important; /* override other status */
|
border-color: rgba($color-checkbox-white, 0.4) !important; /* override other status */
|
||||||
}
|
}
|
||||||
&:checked:disabled + label:before {
|
&:checked:disabled + label:before {
|
||||||
box-shadow: inset 0px 0px 0px 2px $color-main-background;
|
box-shadow: inset 0px 0px 0px 2px $color-main-background;
|
||||||
border-color: rgba(#fff, 0.4) !important; /* override other status */
|
border-color: rgba($color-checkbox-white, 0.4) !important; /* override other status */
|
||||||
background-color: darken(#fff, 27%);
|
background-color: darken($color-checkbox-white, 27%);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&.checkbox--white {
|
&.checkbox--white {
|
||||||
&:checked + label:before,
|
&:checked + label:before,
|
||||||
&:indeterminate + label:before {
|
&:indeterminate + label:before {
|
||||||
background-color: transparent !important; /* Override default checked */
|
background-color: transparent !important; /* Override default checked */
|
||||||
border-color: #fff !important; /* Override default checked */
|
border-color: $color-checkbox-white !important; /* Override default checked */
|
||||||
background-image: url('../img/actions/checkbox-mark-white.svg');
|
background-image: url('../img/actions/checkbox-mark-white.svg');
|
||||||
}
|
}
|
||||||
&:indeterminate + label:before {
|
&:indeterminate + label:before {
|
||||||
|
|
Loading…
Reference in New Issue