[gtk+] Adwaita: better colorswatches for the dark theme

[Lapo Calamandrei <lapo src gnome org>]

commit 663a50dd4eb061f6895e3f0b25cba9f6ea896229
Author: Lapo Calamandrei <calamandrei gmail com>
Date:   Fri Jul 18 23:48:33 2014 +0200

    Adwaita: better colorswatches for the dark theme
    
    ...which reveals a "nice" border/fill border radius issue.

 gtk/resources/theme/Adwaita/_common.scss           |   34 ++++++++++++++++---
 gtk/resources/theme/Adwaita/gtk-contained-dark.css |   15 ++++++--
 gtk/resources/theme/Adwaita/gtk-contained.css      |    9 +++++-
 3 files changed, 47 insertions(+), 11 deletions(-)
---
diff --git a/gtk/resources/theme/Adwaita/_common.scss b/gtk/resources/theme/Adwaita/_common.scss
index e9b4036..586e280 100644
--- a/gtk/resources/theme/Adwaita/_common.scss
+++ b/gtk/resources/theme/Adwaita/_common.scss
@@ -525,8 +525,15 @@ GtkLabel {
   }
 }
 
-GtkColorButton.button { padding: 4px; } // Uniform padding on the
-                                        // GtkColorButton.button
+GtkColorButton.button { 
+  padding: 4px; // Uniform padding on the GtkColorButton
+  GtkColorSwatch {
+    border-radius: 1.5px;
+    box-shadow: inset 0 1px 1px transparentize(black, 0.8),
+                $widget_edge;
+    &:backdrop { box-shadow: none; }
+  }
+}
 
 /*********
  * Links *
@@ -2295,8 +2302,16 @@ GtkInfoBar {
 
 GtkColorSwatch {
 
-  border: 1px solid transparentize(black,0.7);
-  box-shadow: inset 0 1px 1px transparentize(black, 0.8);
+  border-width: 1px;
+  border-style: solid;
+  @if $variant == light {
+    border-color: transparentize(black,0.7);
+    box-shadow: inset 0 1px 1px transparentize(black, 0.8);
+  }
+  @else {
+    border-color: $borders_color;
+    box-shadow: inset 0 1px 1px transparentize(black, 0.6);
+  }
 
   &.color-light {
     &:hover {
@@ -2315,9 +2330,16 @@ GtkColorSwatch {
     }
   }
 
-  &:hover { border-color: transparentize(black, 0.5); }
+  &:hover {
+   border-color: if($variant=='light', transparentize(black, 0.5),
+                                       $backdrop_borders_color);
+  }
 
-  &:backdrop { border-color: transparentize(black,0.8); box-shadow: none; }
+  &:backdrop {
+    border-color: if($variant=='light', transparentize(black,0.8),
+                                        $backdrop_borders_color);
+    box-shadow: none;
+  }
 
   &.top {
     border-top-left-radius: 5px;
diff --git a/gtk/resources/theme/Adwaita/gtk-contained-dark.css 
b/gtk/resources/theme/Adwaita/gtk-contained-dark.css
index e38d02a..af6e850 100644
--- a/gtk/resources/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/resources/theme/Adwaita/gtk-contained-dark.css
@@ -634,6 +634,11 @@
 
 GtkColorButton.button {
   padding: 4px; }
+  GtkColorButton.button GtkColorSwatch {
+    border-radius: 1.5px;
+    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px rgba(238, 238, 236, 0.1); }
+    GtkColorButton.button GtkColorSwatch:backdrop {
+      box-shadow: none; }
 
 /*********
  * Links *
@@ -2860,8 +2865,10 @@ GtkInfoBar {
  * Color Chooser *
  *****************/
 GtkColorSwatch {
-  border: 1px solid rgba(0, 0, 0, 0.3);
-  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.2); }
+  border-width: 1px;
+  border-style: solid;
+  border-color: #1c1f1f;
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.4); }
   GtkColorSwatch.color-light:hover {
     background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 0.4)); }
     GtkColorSwatch.color-light:hover:backdrop {
@@ -2871,9 +2878,9 @@ GtkColorSwatch {
     GtkColorSwatch.color-dark:hover:backdrop {
       background-image: none; }
   GtkColorSwatch:hover {
-    border-color: rgba(0, 0, 0, 0.5); }
+    border-color: #1e2222; }
   GtkColorSwatch:backdrop {
-    border-color: rgba(0, 0, 0, 0.2);
+    border-color: #1e2222;
     box-shadow: none; }
   GtkColorSwatch.top {
     border-top-left-radius: 5px;
diff --git a/gtk/resources/theme/Adwaita/gtk-contained.css b/gtk/resources/theme/Adwaita/gtk-contained.css
index c71989b..27b902a 100644
--- a/gtk/resources/theme/Adwaita/gtk-contained.css
+++ b/gtk/resources/theme/Adwaita/gtk-contained.css
@@ -626,6 +626,11 @@
 
 GtkColorButton.button {
   padding: 4px; }
+  GtkColorButton.button GtkColorSwatch {
+    border-radius: 1.5px;
+    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.2), 0 1px white; }
+    GtkColorButton.button GtkColorSwatch:backdrop {
+      box-shadow: none; }
 
 /*********
  * Links *
@@ -2852,7 +2857,9 @@ GtkInfoBar {
  * Color Chooser *
  *****************/
 GtkColorSwatch {
-  border: 1px solid rgba(0, 0, 0, 0.3);
+  border-width: 1px;
+  border-style: solid;
+  border-color: rgba(0, 0, 0, 0.3);
   box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.2); }
   GtkColorSwatch.color-light:hover {
     background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 0.4)); }