[gtk/wip/jimmac/adwaita-3-32] Adwaita: switches with no labels

[Jakub Steiner <jimmac src gnome org>]

commit b522c59880aaa95de6e40a5672f3f2728b2b9eec
Author: Jakub Steiner <jimmac gmail com>
Date:   Mon Jan 28 12:34:48 2019 +0100

    Adwaita: switches with no labels
    
    - it's less busy and still clearer without the label
    - It may be right that color alone is a poor differentiator,
      but labels do still exist for the accessible theme.

 gtk/theme/Adwaita/_common.scss           | 4 ++--
 gtk/theme/Adwaita/gtk-contained-dark.css | 4 +++-
 gtk/theme/Adwaita/gtk-contained.css      | 4 +++-
 3 files changed, 8 insertions(+), 4 deletions(-)
---
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index de6856821d..92897033ab 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -2740,8 +2740,6 @@ treeview ~ scrollbar.vertical {
  * Switch *
  **********/
 switch {
-  font-weight: bold;
-  font-size: x-small;
   outline-offset: -4px;
 
   // similar to the .scale
@@ -2799,6 +2797,8 @@ switch {
     @include button(normal-alt, $edge: $shadow_color);
   }
 
+  image { color: transparent; } /* only show i / o for the accessible theme */
+
   &:hover slider { @include button(hover-alt, $edge: $shadow_color); }
 
   &:checked slider { border: 1px solid $selected_borders_color; }
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index c89acc316c..42e8410100 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -1081,7 +1081,7 @@ scrollbar.horizontal button.up { -gtk-icon-source: -gtk-icontheme("pan-start-sym
 treeview ~ scrollbar.vertical { border-top: 1px solid #1b1b1b; margin-top: -1px; }
 
 /********** Switch * */
-switch { font-weight: bold; font-size: x-small; outline-offset: -4px; border: 1px solid #1b1b1b; 
border-radius: 14px; color: #eeeeec; background-color: #282828; text-shadow: 0 1px rgba(0, 0, 0, 0.1); }
+switch { outline-offset: -4px; border: 1px solid #1b1b1b; border-radius: 14px; color: #eeeeec; 
background-color: #282828; text-shadow: 0 1px rgba(0, 0, 0, 0.1); /* only show i / o for the accessible theme 
*/ }
 
 switch:checked { color: #ffffff; border-color: #030c17; background-color: #15539e; text-shadow: 0 1px 
rgba(3, 12, 23, 0.5), 0 0 2px rgba(255, 255, 255, 0.6); }
 
@@ -1095,6 +1095,8 @@ switch:backdrop:disabled { color: #5b5b5b; border-color: #202020; background-col
 
 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: #070707; text-shadow: 0 -1px rgba(0, 0, 0, 0.834353); 
-gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 0.834353); background-image: linear-gradient(to bottom, #2d2d2d 20%, 
#262626 90%); box-shadow: inset 0 1px rgba(255, 255, 255, 0.02), 0 1px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 
0, 0, 0.07); }
 
+switch image { color: transparent; }
+
 switch:hover slider { color: #eeeeec; outline-color: rgba(238, 238, 236, 0.3); border-color: #070707; 
box-shadow: inset 0 1px rgba(255, 255, 255, 0.02), 0 1px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.07); 
background-image: linear-gradient(to bottom, #353535 20%, #2b2b2b 90%); }
 
 switch:checked slider { border: 1px solid #030c17; }
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index ac6a5ebef2..38f369a118 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -1089,7 +1089,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: x-small; 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); }
+switch { 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); /* only show i / o for the accessible theme 
*/ }
 
 switch:checked { color: #ffffff; border-color: #185fb4; background-color: #3584e4; text-shadow: 0 1px 
rgba(24, 95, 180, 0.5), 0 0 2px rgba(255, 255, 255, 0.6); }
 
@@ -1103,6 +1103,8 @@ switch:backdrop:disabled { color: #d4cfca; border-color: #d5d0cc; background-col
 
 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, 0 1px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 
0, 0, 0.07); }
 
+switch image { color: transparent; }
+
 switch:hover slider { color: #2e3436; outline-color: rgba(46, 52, 54, 0.3); border-color: #bfb8b1; 
box-shadow: inset 0 1px white, 0 1px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.07); background-image: 
linear-gradient(to bottom, white 10%, white 90%); }
 
 switch:checked slider { border: 1px solid #185fb4; }