2019-12-18 21:25:03 +00:00
|
|
|
/* Activities Ripple */
|
|
|
|
|
|
|
|
$ripple_size: 50px;
|
|
|
|
|
|
|
|
.ripple-box {
|
2019-12-19 15:38:27 +00:00
|
|
|
background-color: lighten(transparentize($selected_bg_color, 0.7), 40%);
|
|
|
|
box-shadow: 0 0 2px 2px lighten($selected_bg_color, 20%);
|
|
|
|
// plus + 2px for the border (box-shadow)
|
|
|
|
width: $ripple_size + 2px;
|
|
|
|
height: $ripple_size + 2px;
|
|
|
|
border-radius: 0 0 $ripple_size + 2px 0; // radius equals the size of the box to give us the curve
|
2019-12-18 21:25:03 +00:00
|
|
|
|
2019-12-19 15:38:27 +00:00
|
|
|
// just a simple change to the border radius position
|
|
|
|
&:rtl { border-radius: 0 0 0 $ripple_size + 2px; }
|
2019-12-18 21:25:03 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
// Pointer location
|
|
|
|
.ripple-pointer-location {
|
2019-12-19 15:38:27 +00:00
|
|
|
width: $ripple_size;
|
|
|
|
height: $ripple_size;
|
|
|
|
border-radius: $ripple_size * 0.5; // radius equals the size of the box to give us the curve
|
|
|
|
background-color: lighten(transparentize($selected_bg_color, 0.7), 30%);
|
|
|
|
box-shadow: 0 0 2px 2px lighten($selected_bg_color, 20%);
|
2019-12-18 21:25:03 +00:00
|
|
|
}
|