[gtk: 1/2] Adwaita: dark switches/check/radios

[Jakub Steiner <jimmac src gnome org>]

commit 435992600f907d58cc2f9ae52a969a49d2f9f286
Author: Jakub Steiner <jimmac gmail com>
Date:   Fri Mar 6 13:13:37 2020 +0100

    Adwaita: dark switches/check/radios
    
    - lighten up radios, switches and checkboxes
    
    Fixes https://gitlab.gnome.org/GNOME/gtk/issues/2461

 gtk/theme/Adwaita/_colors.scss |  3 ++-
 gtk/theme/Adwaita/_common.scss | 36 ++++++++++++++++++------------------
 2 files changed, 20 insertions(+), 19 deletions(-)
---
diff --git a/gtk/theme/Adwaita/_colors.scss b/gtk/theme/Adwaita/_colors.scss
index 810a668539..c565f706b0 100644
--- a/gtk/theme/Adwaita/_colors.scss
+++ b/gtk/theme/Adwaita/_colors.scss
@@ -73,5 +73,6 @@ $suggested_bg_color: $selected_bg_color;
 $suggested_border_color: $selected_borders_color;
 $progress_bg_color: $selected_bg_color;
 $progress_border_color: $selected_borders_color;
-$checkradio_bg_color: $selected_bg_color;
+$checkradio_bg_color: if($variant == 'light', $selected_bg_color, lighten($selected_bg_color,10%));
 $checkradio_fg_color: $selected_fg_color;
+$checkradio_borders_color: if($variant == 'light', darken($checkradio_bg_color,20%), 
darken($checkradio_bg_color,40%));
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index 9c57b2f173..ef69af3768 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -2254,8 +2254,8 @@ switch {
 
   &:checked {
     color: $selected_fg_color;
-    border-color: $selected_borders_color;
-    background-color: $selected_bg_color;
+    border-color: $checkradio_borders_color;
+    background-color: $checkradio_bg_color;
     text-shadow: 0 1px transparentize($selected_borders_color, 0.5),
                  0 0 2px transparentize(white, 0.4);
   }
@@ -2276,9 +2276,9 @@ switch {
 
     &:checked {
       @if $variant == 'light' { color: $backdrop_bg_color; }
-      border-color: if($variant == 'light', $selected_bg_color,
+      border-color: if($variant == 'light', $checkradio_borders_color,
                                             $selected_borders_color);
-      background-color: $selected_bg_color;
+      background-color: $checkradio_bg_color;
     }
 
     &:disabled {
@@ -2315,7 +2315,7 @@ switch {
     }
   }
 
-  &:checked > slider { border: 1px solid $selected_borders_color; }
+  &:checked > slider { border: 1px solid $checkradio_borders_color; }
 
   &:disabled > slider { @include button(insensitive); }
 
@@ -2326,7 +2326,7 @@ switch {
       @include button(backdrop);
     }
 
-    &:checked > slider { border-color: if($variant == 'light', $selected_bg_color, $selected_borders_color); 
}
+    &:checked > slider { border-color: $checkradio_borders_color; }
 
     &:disabled > slider { @include button(backdrop-insensitive); }
   }
@@ -2334,11 +2334,11 @@ switch {
   row:selected & {
     @if $variant == 'light' {
       box-shadow: none;
-      border-color: $selected_borders_color;
+      border-color: $checkradio_borders_color;
 
-      &:backdrop { border-color: $selected_borders_color; }
+      &:backdrop { border-color: $checkradio_borders_color; }
 
-      > slider { &:checked, & { border-color: $selected_borders_color; } }
+      > slider { &:checked, & { border-color: $checkradio_borders_color; } }
     }
   }
 }
@@ -2353,14 +2353,14 @@ switch {
 
 //selection-mode
 @each $check_state, $check_icon, $check_color, $check_background in
-  ('', 'none', 'transparent', '#{transparentize($selected_bg_color, .05)}'),
-  (':hover', 'none', 'transparent', '#{transparentize($selected_bg_color, .05)}'),
-  (':active', 'none', 'transparent', '#{transparentize($selected_bg_color, .05)}'),
-  (':backdrop', 'none', 'transparent', '#{transparentize(desaturate($selected_bg_color, 100%), .05)}'),
-  (':checked', '-gtk-icontheme(\'object-select-symbolic\')', '#{$osd_fg_color}', 
'#{transparentize($selected_bg_color, .05)}'),
-  (':checked:hover', '-gtk-icontheme(\'object-select-symbolic\')', '#{$osd_fg_color}', 
'#{transparentize($selected_bg_color, .05)}'),
-  (':checked:active', '-gtk-icontheme(\'object-select-symbolic\')', '#{$osd_fg_color}', 
'#{transparentize($selected_bg_color, .05)}'),
-  (':backdrop:checked', '-gtk-icontheme(\'object-select-symbolic\')', '#{transparentize($osd_fg_color, 
0.2)}', '#{transparentize(desaturate($selected_bg_color, 100%), .05)}'), {
+  ('', 'none', 'transparent', '$checkradio_bg_color'),
+  (':hover', 'none', 'transparent', '$checkradio_bg_color'),
+  (':active', 'none', 'transparent', '$checkradio_bg_color'),
+  (':backdrop', 'none', 'transparent', '#{desaturate($checkradio_bg_color, 100%)}'),
+  (':checked', '-gtk-icontheme(\'object-select-symbolic\')', '#{$osd_fg_color}', '$checkradio_bg_color'),
+  (':checked:hover', '-gtk-icontheme(\'object-select-symbolic\')', '#{$osd_fg_color}', 
'$checkradio_bg_color'),
+  (':checked:active', '-gtk-icontheme(\'object-select-symbolic\')', '#{$osd_fg_color}', 
'$checkradio_bg_color'),
+  (':backdrop:checked', '-gtk-icontheme(\'object-select-symbolic\')', '#{transparentize($osd_fg_color, 
0.2)}', '#{desaturate($checkradio_bg_color, 100%)}'), {
 
   .view.content-view.check#{$check_state}:not(list),
   .content-view .tile check#{$check_state}:not(list) {
@@ -2436,7 +2436,7 @@ radio {
   @if $variant == 'light' {
     // the borders of the light variant versions of checks and radios are too similar in luminosity to the 
selected background
     // color, hence we need special casing.
-    row:selected & { border-color: $selected_borders_color; }
+    row:selected & { border-color: $checkradio_borders_color; }
   }
 
   .osd & {