44 lines
989 B
SCSS
44 lines
989 B
SCSS
|
@import 'mixins';
|
||
|
|
|
||
|
|
$indicator_size: 16px;
|
||
|
|
$indicator_color: $dark-grass;
|
||
|
|
|
||
|
|
.givingIndicator-wrapper{
|
||
|
|
width: 18px;
|
||
|
|
}
|
||
|
|
.givingIndicator {
|
||
|
|
height: $indicator_size;
|
||
|
|
width: $indicator_size;
|
||
|
|
@include border-radius(50%);
|
||
|
|
}
|
||
|
|
.givingIndicator[level='1'] {
|
||
|
|
@include opacity(0.3);
|
||
|
|
background: lighten($indicator_color, 50);
|
||
|
|
}
|
||
|
|
.givingIndicator[level='2'] {
|
||
|
|
@include opacity(0.4);
|
||
|
|
background: lighten($indicator_color, 40);
|
||
|
|
}
|
||
|
|
.givingIndicator[level='3'] {
|
||
|
|
@include opacity(0.5);
|
||
|
|
background: lighten($indicator_color, 30);
|
||
|
|
}
|
||
|
|
.givingIndicator[level='4'] {
|
||
|
|
@include opacity(0.6);
|
||
|
|
background: lighten($indicator_color, 20);
|
||
|
|
}
|
||
|
|
.givingIndicator[level='5'] {
|
||
|
|
@include opacity(0.7);
|
||
|
|
background: lighten($indicator_color, 10);
|
||
|
|
}
|
||
|
|
.givingIndicator[level='6'] {
|
||
|
|
@include opacity(0.8);
|
||
|
|
background: darken($indicator_color, 0);
|
||
|
|
}
|
||
|
|
.givingIndicator[level='7'] {
|
||
|
|
@include opacity(0.9);
|
||
|
|
background: darken($indicator_color, 10);
|
||
|
|
}
|
||
|
|
.givingIndicator[level='8'] {
|
||
|
|
background: darken($indicator_color, 20);
|
||
|
|
}
|