2023-05-25 17:25:11 -04:00
|
|
|
/* Slider */
|
|
|
|
|
2024-03-25 13:34:36 -04:00
|
|
|
$slider_size: $scalable_icon_size;
|
2023-05-25 17:25:11 -04:00
|
|
|
|
|
|
|
.slider {
|
2024-09-19 20:40:52 -04:00
|
|
|
color: if($variant == 'light', $fg_color, darken($fg_color, 9%));
|
|
|
|
|
2023-05-25 17:25:11 -04:00
|
|
|
// slider trough
|
|
|
|
-barlevel-height: 4px;
|
2024-09-19 20:40:52 -04:00
|
|
|
-barlevel-background-color: transparentize($fg_color, 0.9);
|
2023-05-25 17:25:11 -04:00
|
|
|
// fill style
|
2024-09-19 20:40:52 -04:00
|
|
|
-barlevel-active-background-color: -st-accent-color;
|
2023-05-25 17:25:11 -04:00
|
|
|
// overfill style (red in this case)
|
|
|
|
-barlevel-overdrive-color: $destructive_color;
|
|
|
|
-barlevel-overdrive-separator-width:1px;
|
|
|
|
// slider handler
|
|
|
|
-slider-handle-radius: $slider_size * 0.5; // half the size of the size
|
2024-03-25 13:34:36 -04:00
|
|
|
|
2024-09-19 20:40:52 -04:00
|
|
|
// hc style
|
|
|
|
@if $contrast == 'high' {
|
|
|
|
-barlevel-background-color: transparentize($fg_color, 0.6);
|
|
|
|
}
|
|
|
|
|
|
|
|
&:hover {
|
|
|
|
color: if($variant == 'light', lighten($fg_color, 7%), $fg_color);
|
|
|
|
}
|
2023-05-25 17:25:11 -04:00
|
|
|
}
|