DigitalConsumer.FixMyGlass/src/styles/commonRadioStyles.scss

44 lines
953 B
SCSS

.radiogroup {
&.radio-list-button {
input[type="radio"] {
opacity: 0;
position: fixed;
width: 0;
&:focus-visible + label {
box-shadow: 0 0 0 2px $blue;
}
&:focus + label {
box-shadow: 0 0 0 2px $blue;
}
&:checked + label {
background: $blue-100;
box-shadow: 0 0 0 1px $blue;
}
}
label {
position: relative;
background: $white;
min-height: 3rem;
transition: all 150ms linear;
border-radius: $border-radius-lg;
border: 1px solid $gray-500;
width: 100%;
&:hover {
box-shadow: 0 0 0 4px $blue-100;
cursor: pointer;
}
+ p {
display: none;
}
&.error {
border: 1px solid $danger;
+ p {
display: flex;
color: $danger;
}
}
//Add spinner. Specify width and height
@include spinner(1rem,1rem);
}
}
}