salix/front/core/components/check/style.scss

47 lines
1.0 KiB
SCSS

@import "variables";
.vn-check {
& > .btn {
border-radius: 2px;
transition: background 250ms;
& > .mark {
box-sizing: border-box;
position: absolute;
display: block;
border-width: 0;
}
}
& > vn-icon {
margin-left: 5px;
color: $color-font-secondary;
vertical-align: middle;
}
&.checked > .btn {
border-color: transparent;
background-color: $color-button;
& > .mark {
top: 0;
left: 4px;
transform: rotate(45deg);
width: 7px;
height: 13px;
border: 2px solid $color-font-dark;
border-top: 0;
border-left: 0;
}
}
&.indeterminate > .btn > .mark {
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 12px;
height: 2px;
border-bottom: 2px solid #666;
}
&.disabled.checked > .btn {
background-color: $color-font-secondary;
}
}