[gtk/gtk-3-24] Adwaita: updated switch control

[Jakub Steiner <jimmac src gnome org>]

commit be7546091351b4ec933490c6e788feabfc676fa4
Author: Jakub Steiner <jimmac gmail com>
Date:   Fri Nov 30 20:53:13 2018 +0100

    Adwaita: updated switch control
    
    - might be nasty to hide labels with CSS. We can fix properly later.
    - the blue border seesm aliased when :checked

 gtk/theme/Adwaita/_common.scss           | 11 +++++++----
 gtk/theme/Adwaita/gtk-contained-dark.css |  4 ++--
 gtk/theme/Adwaita/gtk-contained.css      |  4 ++--
 3 files changed, 11 insertions(+), 8 deletions(-)
---
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index bd9862a488..e9818383d1 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -2703,10 +2703,11 @@ switch {
 
   // similar to the .scale
   border: 1px solid $borders_color;
-  border-radius: 3px;
+  border-radius: 14px;
   color: $fg_color;
   background-color: $dark_fill;
   text-shadow: 0 1px transparentize(black, 0.9);
+  font-size: 0; /*FIXME: quick workaround for the labels*/
 
   &:checked {
     color: $selected_fg_color;
@@ -2746,11 +2747,12 @@ switch {
 
   slider {
     margin: -1px;
-    min-width: 44px;
-    min-height: 26px;
+    min-width: 24px;
+    min-height: 24px;
     border: 1px solid;
-    border-radius: 3px;
+    border-radius: 50%;
     transition: $button_transition;
+    -gtk-outline-radius: 20px;
 
     @include button(normal-alt, $edge: $shadow_color);
   }
@@ -2786,6 +2788,7 @@ switch {
       slider { &:checked, & { border-color: $selected_borders_color; } }
     }
   }
+
 }
 
 
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index b84686a0f7..b2a260d3b2 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -1067,7 +1067,7 @@ scrollbar.horizontal button.up { -gtk-icon-source: -gtk-icontheme("pan-start-sym
 treeview ~ scrollbar.vertical { border-top: 1px solid #252526; margin-top: -1px; }
 
 /********** Switch * */
-switch { font-weight: bold; font-size: smaller; outline-offset: -4px; border: 1px solid #252526; 
border-radius: 3px; color: #eeeeec; background-color: #323233; text-shadow: 0 1px rgba(0, 0, 0, 0.1); }
+switch { font-weight: bold; font-size: smaller; outline-offset: -4px; border: 1px solid #252526; 
border-radius: 14px; color: #eeeeec; background-color: #323233; text-shadow: 0 1px rgba(0, 0, 0, 0.1); 
font-size: 0; /*quick woraround for the labels*/ }
 
 switch:checked { color: #ffffff; border-color: #092444; background-color: #15539e; text-shadow: 0 1px 
rgba(9, 36, 68, 0.5), 0 0 2px rgba(255, 255, 255, 0.6); }
 
@@ -1079,7 +1079,7 @@ switch:backdrop:checked { border-color: #092444; background-color: #15539e; }
 
 switch:backdrop:disabled { color: #656466; border-color: #2a2a2b; background-color: #353338; }
 
-switch slider { margin: -1px; min-width: 44px; min-height: 26px; border: 1px solid; border-radius: 3px; 
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: #eeeeec; outline-color: rgba(238, 238, 
236, 0.3); border-color: #111111; text-shadow: 0 -1px rgba(0, 0, 0, 0.802353); -gtk-icon-shadow: 0 -1px 
rgba(0, 0, 0, 0.802353); background-image: linear-gradient(to bottom, #373738 20%, #302f30 90%); box-shadow: 
inset 0 1px rgba(255, 255, 255, 0.05), inset 0 -2px #353435, inset 0 -1px #282828, 0 1px rgba(0, 0, 0, 0.1); }
+switch slider { margin: -1px; min-width: 24px; min-height: 24px; border: 1px solid; border-radius: 50%; 
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); -gtk-outline-radius: 20px; color: #eeeeec; 
outline-color: rgba(238, 238, 236, 0.3); border-color: #111111; text-shadow: 0 -1px rgba(0, 0, 0, 0.802353); 
-gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 0.802353); background-image: linear-gradient(to bottom, #373738 20%, 
#302f30 90%); box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), inset 0 -2px #353435, inset 0 -1px #282828, 
0 1px rgba(0, 0, 0, 0.1); }
 
 switch:hover slider { color: #eeeeec; outline-color: rgba(238, 238, 236, 0.3); border-color: #111111; 
box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), inset 0 -2px #373738, inset 0 -1px #302f30, 0 1px rgba(0, 
0, 0, 0.1); background-image: linear-gradient(to bottom, #3f3e40 20%, #353435 90%); }
 
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index dd244cd278..0c6cce1fa2 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -1075,7 +1075,7 @@ scrollbar.horizontal button.up { -gtk-icon-source: -gtk-icontheme("pan-start-sym
 treeview ~ scrollbar.vertical { border-top: 1px solid #cdc7c2; margin-top: -1px; }
 
 /********** Switch * */
-switch { font-weight: bold; font-size: smaller; outline-offset: -4px; border: 1px solid #cdc7c2; 
border-radius: 3px; color: #2e3436; background-color: #e1dedb; text-shadow: 0 1px rgba(0, 0, 0, 0.1); }
+switch { font-weight: bold; font-size: smaller; outline-offset: -4px; border: 1px solid #cdc7c2; 
border-radius: 14px; color: #2e3436; background-color: #e1dedb; text-shadow: 0 1px rgba(0, 0, 0, 0.1); 
font-size: 0; /*quick woraround for the labels*/ }
 
 switch:checked { color: #ffffff; border-color: #0f3b71; background-color: #3584e4; text-shadow: 0 1px 
rgba(15, 59, 113, 0.5), 0 0 2px rgba(255, 255, 255, 0.6); }
 
@@ -1087,7 +1087,7 @@ switch:backdrop:checked { color: #f6f5f4; border-color: #3584e4; background-colo
 
 switch:backdrop:disabled { color: #d4cfca; border-color: #d5d0cc; background-color: #faf9f8; }
 
-switch slider { margin: -1px; min-width: 44px; min-height: 26px; border: 1px solid; border-radius: 3px; 
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); color: #2e3436; outline-color: rgba(46, 52, 54, 
0.3); border-color: #bfb8b1; text-shadow: 0 1px rgba(255, 255, 255, 0.769231); -gtk-icon-shadow: 0 1px 
rgba(255, 255, 255, 0.769231); background-image: linear-gradient(to bottom, white 20%, #f6f5f4 90%); 
box-shadow: inset 0 1px white, inset 0 -2px #fbfafa, inset 0 -1px #dad6d2, 0 1px rgba(0, 0, 0, 0.1); }
+switch slider { margin: -1px; min-width: 24px; min-height: 24px; border: 1px solid; border-radius: 50%; 
transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94); -gtk-outline-radius: 20px; color: #2e3436; 
outline-color: rgba(46, 52, 54, 0.3); border-color: #bfb8b1; text-shadow: 0 1px rgba(255, 255, 255, 
0.769231); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.769231); background-image: linear-gradient(to 
bottom, white 20%, #f6f5f4 90%); box-shadow: inset 0 1px white, inset 0 -2px #fbfafa, inset 0 -1px #dad6d2, 0 
1px rgba(0, 0, 0, 0.1); }
 
 switch:hover slider { color: #2e3436; outline-color: rgba(46, 52, 54, 0.3); border-color: #bfb8b1; 
box-shadow: inset 0 1px white, inset 0 -2px white, inset 0 -1px #dfdcd8, 0 1px rgba(0, 0, 0, 0.1); 
background-image: linear-gradient(to bottom, white 10%, white 90%); }