open-vault/ui/app/styles/components/box-label.scss
2018-07-09 12:20:09 -06:00

64 lines
1,011 B
SCSS

label.box-label {
cursor: pointer;
}
.box-label {
@extend .box;
@extend .is-centered;
@extend .is-gapless;
border-color: $grey-light;
border-radius: 3px;
box-shadow: $box-link-shadow, $box-shadow-middle;
text-decoration: none;
transition: box-shadow $speed;
width: 100%;
> div:first-child {
flex-grow: 1;
}
&.is-column {
@extend .is-flex-column;
}
&.is-selected {
box-shadow: $box-link-hover-shadow, $box-shadow-middle;
.icon {
color: $grey;
}
}
.icon {
color: $grey-light;
}
input[type=radio] {
display: none;
}
input[type=radio] + label {
border: 1px solid $grey-light;
border-radius: 50%;
cursor: pointer;
display: block;
margin: 1rem auto 0;
height: 1rem;
width: 1rem;
}
input[type=radio]:checked + label {
background: $blue;
border: 1px solid $blue;
box-shadow: inset 0 0 0 0.15rem $white;
}
}
.box-label-header {
color: $grey;
.is-selected & {
color: $text;
}
}