32 lines
1.3 KiB
SCSS
32 lines
1.3 KiB
SCSS
@mixin form-control-validation-severity-state($color) {
|
|
background-image: escape-svg(url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='#{$color}' viewBox='0 0 12 12'><circle cx='6' cy='6' r='4.5'/><path stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/><circle cx='6' cy='8.2' r='.6' fill='#{$color}' stroke='none'/></svg>"));
|
|
|
|
&:focus {
|
|
border-color: $color;
|
|
box-shadow: 0 0 0 $form-select-focus-width rgba($color, .25);
|
|
}
|
|
}
|
|
|
|
@mixin form-select-validation-severity-state($color) {
|
|
background-image: escape-svg(url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='#{$color}'><circle cx='6' cy='6' r='4.5'/><path stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/><circle cx='6' cy='8.2' r='.6' fill='#{$color}' stroke='none'/></svg>"));
|
|
background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
|
|
|
|
&:focus {
|
|
box-shadow: 0 0 0 $form-select-focus-width rgba($color, .25);
|
|
}
|
|
}
|
|
|
|
@mixin form-check-input-validation-severity-state($color) {
|
|
& {
|
|
border-color: $color;
|
|
}
|
|
&:checked {
|
|
background-color: $color;
|
|
}
|
|
& ~ .form-check-label {
|
|
color: unset;
|
|
}
|
|
&:focus {
|
|
box-shadow: 0 0 0 0.2rem rgba($color, .25);
|
|
}
|
|
} |