39 lines
No EOL
882 B
SCSS
39 lines
No EOL
882 B
SCSS
@use '../../partials/flex';
|
|
@use './state';
|
|
|
|
.checkbox {
|
|
width: 20px;
|
|
height: 20px;
|
|
|
|
border-radius: calc(var(--bo-radius) / 2);
|
|
background-color: var(--bg-surface-border);
|
|
box-shadow: var(--bs-surface-border);
|
|
cursor: pointer;
|
|
@include state.disabled;
|
|
@extend .cp-fx__row--c-c;
|
|
|
|
&--active {
|
|
background-color: black;
|
|
&::before {
|
|
content: "";
|
|
display: inline-block;
|
|
width: 12px;
|
|
height: 6px;
|
|
border: 6px solid white;
|
|
border-width: 0 0 3px 3px;
|
|
transform: rotateZ(-45deg) translate(1px, -1px);
|
|
}
|
|
}
|
|
}
|
|
.checkbox-primary.checkbox--active {
|
|
background-color: var(--bg-primary);
|
|
}
|
|
.checkbox-positive.checkbox--active {
|
|
background-color: var(--bg-positive);
|
|
}
|
|
.checkbox-caution.checkbox--active {
|
|
background-color: var(--bg-caution);
|
|
}
|
|
.checkbox-danger.checkbox--active {
|
|
background-color: var(--bg-danger);
|
|
} |