diff --git a/gtk-3.20/scss/_global.scss b/gtk-3.20/scss/_global.scss index aaa0cd2..0a5d188 100755 --- a/gtk-3.20/scss/_global.scss +++ b/gtk-3.20/scss/_global.scss @@ -36,6 +36,14 @@ $scrollbar_slider_color: shade($bg_color, .5); $scrollbar_slider_hover_color: shade($bg_color, .3); $scrollbar_slider_active_color: if($variant == 'light', darken($selected_bg_color, 5%), lighten($selected_bg_color, 10%)); +$switch_disabled_bg_color: #d8d8d8; +$switch_disabled_border_color: #ccc; +$switch_disabled_fg_color: mix(#444, #f0f0f0, 0.5); +$switch_disabled_slider_bg_color: #e8eaec; +$switch_bg_color: #fbfbfb; +$switch_fg_color: #8e969e; +$switch_slider_bg_color: #fbfbfb; + // misc colors used by gtk+ $info_fg_color: #fff; $info_bg_color: #03a9f4; diff --git a/gtk-3.20/scss/widgets/_toggle.scss b/gtk-3.20/scss/widgets/_toggle.scss index 368ed5e..bfb062b 100755 --- a/gtk-3.20/scss/widgets/_toggle.scss +++ b/gtk-3.20/scss/widgets/_toggle.scss @@ -73,43 +73,43 @@ $suffix: if($variant == "dark", "-dark", ""); @include exports("switch") { switch { - border-radius: 3px; - padding: 5px; + border-radius: $roundness; + padding: $spacing; border: none; outline: none; transition: all 0.4s linear; - transition: background-colot 0.4s linear; + transition: background-color 0.3s linear; min-width: 93px; min-height: 25px; - background-color: $base_color; - color: $text_color; + background-color: $switch_bg_color; + color: $switch_fg_color; slider { - background-color: mix($text_color, $bg_color, .5); + background-color: $switch_slider_bg_color; transition: all 0.3s linear; box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1); - border-radius: 2px; + border-radius: $roundness; } &:checked { background-color: $selected_bg_color; background-image: none; border-color: $selected_bg_color; - color: $selected_fg_color; + color: $base_color; slider { - background-color: $selected_fg_color; + background-color: $white; } } &:disabled { - background-color: mix($bg_color, $base_color, .5); + background-color: $switch_disabled_bg_color; background-image: none; - /*border-color: #ccc;*/ - color: mix($text_color, $bg_color, .5); + border-color: $switch_disabled_border_color; + color: $switch_disabled_fg_color; slider { - background-color: $bg_color; + background-color: $switch_disabled_slider_bg_color; } } }