39 lines
895 B
SCSS
39 lines
895 B
SCSS
@import '../../../styles/variables';
|
|
|
|
.status {
|
|
display: inline-block;
|
|
position: relative;
|
|
cursor: help;
|
|
padding: .5rem;
|
|
}
|
|
|
|
/* default: red square */
|
|
.statusIndicator {
|
|
width: $font-size-small;
|
|
height: $font-size-small;
|
|
display: block;
|
|
background: $red;
|
|
}
|
|
|
|
/* yellow triangle */
|
|
.statusIndicatorCloseEnough {
|
|
// stylelint-disable value-keyword-case
|
|
composes: statusindicator;
|
|
// stylelint-enable value-keyword-case
|
|
background: none;
|
|
width: 0;
|
|
height: 0;
|
|
border-left: $font-size-small / 1.7 solid transparent;
|
|
border-right: $font-size-small / 1.7 solid transparent;
|
|
border-bottom: $font-size-small solid $yellow;
|
|
}
|
|
|
|
/* green circle */
|
|
.statusIndicatorActive {
|
|
// stylelint-disable value-keyword-case
|
|
composes: statusindicator;
|
|
// stylelint-enable value-keyword-case
|
|
border-radius: 50%;
|
|
background: $green;
|
|
}
|