Files
SweetTokyoNight/gtk-3.0/widgets/_switches.scss
2018-11-17 15:34:25 -06:00

95 lines
1.8 KiB
SCSS

/**********
* Switch *
**********/
switch {
font-size: 1px;
font-weight: bold;
outline-offset: -4px;
transition: all 200ms ease-in;
border: none;
border-radius: 14px;
color: transparent;
padding: 2.3px 0px;
background: linear-gradient(to right, #0e1011, #0e1011);
border: 1px solid #0a0b0c;
&:disabled {
background-color: $insensitive_bg_color;
}
&:backdrop {
background-color: $backdrop_bg_color;
transition: $backdrop_transition;
&:disabled { background-color: $insensitive_bg_color; }
}
&:active,
&:checked {
slider{
background: linear-gradient(to right, #00a6c9, #00e4ce);
}
&:backdrop {
slider {
&:backdrop {
box-shadow:none;
background: linear-gradient(to right, darken(#00a6c9, 10%), darken(#00e4ce, 10%));
border:none;
}
}
}
}
// Handle
slider {
padding:2px;
margin: 0 2.3px;
min-width: 12px;
min-height: 12px;
border-radius: 100%;
transition: $button_transition;
background-color: lighten(#0e1011, 5%);
&:backdrop {
padding:2px;
box-shadow:none;
background-color:$base_color;
}
}
&:checked slider { }
&: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
trough {
&:active,
&:checked {
background-color: $selected_bg_color;
&:backdrop {
background-color: $backdrop_selected_bg_color;
}
}
}
}