gnome-shell-dark-theme/gnome-shell-sass/widgets/_switches.scss

54 lines
1.2 KiB
SCSS
Raw Normal View History

/* Switches */
2024-03-25 13:34:36 -04:00
$switch_width: 46px;
2024-09-19 20:40:52 -04:00
$switch_handle_size: 20px;
.toggle-switch {
width: $switch_width;
2024-09-19 20:40:52 -04:00
border-radius: $forced_circular_radius;
transition-duration: 100ms;
color: $fg_color;
@if $contrast == 'high' {
background: transparentize(if($variant == 'light', black, white), .7);
&:hover {
background: transparentize(if($variant == 'light', black, white), .6);
}
} @else {
background: transparentize(if($variant == 'light', black, white), .85);
&:hover {
background: transparentize(if($variant == 'light', black, white), .8);
}
}
StIcon {
icon-size: $base_icon_size;
}
.handle {
margin: 3px;
width: $switch_handle_size;
height: $switch_handle_size;
border-radius: $forced_circular_radius;
background: if($variant == 'light', white, mix(white, $bg_color, 80%));
box-shadow: 0 2px 4px transparentize(black, .8);
transition-duration: 100ms;
}
2024-03-25 13:34:36 -04:00
2024-09-19 20:40:52 -04:00
&:checked {
background: -st-accent-color;
color: -st-accent-fg-color;
&:hover {
background-color: st-lighten(-st-accent-color, 5%);
color: st-lighten(-st-accent-fg-color, 5%);
}
.handle {
background: white;
}
}
}