Files
paper-gtk-theme/Paper/gtk-3.20/widgets/_switches.scss

98 lines
1.9 KiB
SCSS
Raw Normal View History

2016-04-14 21:54:38 -04:00
/**********
* Switch *
**********/
switch {
font: 1;
font-weight: bold;
outline-offset: -4px;
transition: all 200ms ease-in;
border: none;
border-radius: 14px;
color: transparent;
padding: 2px;
2016-04-15 12:59:10 -04:00
background-color: transparentize(black, 0.9);
2016-04-16 11:01:16 -04:00
box-shadow: inset 0 0 0 1px transparentize(black, 0.95), 0px 1px $bottom_highlight;
2016-04-14 21:54:38 -04:00
&:disabled {
2016-04-15 12:59:10 -04:00
background-color: $insensitive_bg_color;
2016-04-14 21:54:38 -04:00
}
&:backdrop {
2016-04-15 12:59:10 -04:00
background-color: $backdrop_bg_color;
2016-04-14 21:54:38 -04:00
transition: $backdrop_transition;
2016-04-15 12:59:10 -04:00
&:disabled { background-color: $insensitive_bg_color; }
}
&:active,
&:checked {
background-color: $selected_bg_color;
&:backdrop {
background-color: $backdrop_selected_bg_color;
slider {
&:backdrop {
box-shadow:none;
background-color:transparentize($base_color, 0.1);
border:none;
}
}
2016-04-14 21:54:38 -04:00
}
}
2016-04-15 12:59:10 -04:00
// Handle
2016-04-14 21:54:38 -04:00
slider {
padding:2px;
2016-04-15 16:49:11 -04:00
min-width: 16px;
min-height: 16px;
2016-04-14 21:54:38 -04:00
border-radius: 50%;
transition: $button_transition;
background-color: $base_color;
box-shadow: 0 2px 2px transparentize(black, 0.8),
0 1px 2px transparentize(black, 0.8);
2016-04-15 12:59:10 -04:00
&:backdrop {
padding:2px;
box-shadow:none;
background-color:$base_color;
}
2016-04-14 21:54:38 -04:00
}
2016-04-15 16:49:11 -04:00
&:checked slider { }
2016-04-14 21:54:38 -04:00
&:backdrop {
}
row:selected & {
@if $variant == 'light' {
box-shadow: none;
border-color: $selected_borders_color;
&:backdrop { border-color: $selected_borders_color; }
&.slider:dir(rtl) { border-left-color: $borders_color; }
&.slider:dir(ltr) { border-right-color: $borders_color; }
&.slider { &:checked, & { border-color: $selected_borders_color; } }
}
}
// Trough
2016-04-18 18:39:13 -04:00
trough {
2016-04-14 21:54:38 -04:00
2016-04-15 12:59:10 -04:00
&:active,
&:checked {
2016-04-14 21:54:38 -04:00
background-color: $selected_bg_color;
2016-04-15 12:59:10 -04:00
&:backdrop {
background-color: $backdrop_selected_bg_color;
}
2016-04-14 21:54:38 -04:00
}
}
}