[gtk+] Adwaita: use an image for backdrop button background

[Lapo Calamandrei <lapo src gnome org>]

commit 1b2203964971b6bdff4b54fd51a58ad760f5caa5
Author: Lapo Calamandrei <calamandrei gmail com>
Date:   Tue Apr 19 23:00:54 2016 +0200

    Adwaita: use an image for backdrop button background
    
    which doesn't make the sliders flash during background transition.

 gtk/theme/Adwaita/_drawing.scss          |    4 +-
 gtk/theme/Adwaita/gtk-contained-dark.css |   44 +++++++++++++++---------------
 gtk/theme/Adwaita/gtk-contained.css      |   44 +++++++++++++++---------------
 3 files changed, 46 insertions(+), 46 deletions(-)
---
diff --git a/gtk/theme/Adwaita/_drawing.scss b/gtk/theme/Adwaita/_drawing.scss
index 0801d02..7491737 100644
--- a/gtk/theme/Adwaita/_drawing.scss
+++ b/gtk/theme/Adwaita/_drawing.scss
@@ -329,8 +329,8 @@
     label, & { color: if($tc!=$fg_color,mix($tc, $_bg, 80%), $backdrop_fg_color); }
 
     border-color: if($c!=$bg_color, $_bc, $backdrop_borders_color);
-    background-color: $_bg;
-    background-image: none;
+    background-color: transparent;
+    background-image: image($_bg);
     text-shadow: none;
     -gtk-icon-shadow: none;
     @include _shadows(inset 0 1px transparentize(white, 1),
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index cad7949..eed9cf5 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -479,8 +479,8 @@ button {
   button:backdrop.flat,
   button:backdrop {
     border-color: #262929;
-    background-color: #393f3f;
-    background-image: none;
+    background-color: transparent;
+    background-image: image(#393f3f);
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -823,8 +823,8 @@ button.suggested-action {
   button.suggested-action:backdrop,
   button.suggested-action.flat:backdrop {
     border-color: #0f2b48;
-    background-color: #215d9c;
-    background-image: none;
+    background-color: transparent;
+    background-image: image(#215d9c);
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1010,8 +1010,8 @@ button.destructive-action {
   button.destructive-action:backdrop,
   button.destructive-action.flat:backdrop {
     border-color: #760909;
-    background-color: #d51010;
-    background-image: none;
+    background-color: transparent;
+    background-image: image(#d51010);
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1253,8 +1253,8 @@ button.needs-attention > image, stacksidebar row.needs-attention > label {
         color: #949796; }
   .inline-toolbar toolbutton > button:backdrop {
     border-color: #262929;
-    background-color: #393f3f;
-    background-image: none;
+    background-color: transparent;
+    background-image: image(#393f3f);
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1840,8 +1840,8 @@ headerbar {
       headerbar.selection-mode button:backdrop.flat,
       headerbar.selection-mode button:backdrop {
         border-color: #0f2b48;
-        background-color: #215d9c;
-        background-image: none;
+        background-color: transparent;
+        background-image: image(#215d9c);
         text-shadow: none;
         -gtk-icon-shadow: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -1988,8 +1988,8 @@ headerbar {
         .selection-mode.titlebar:not(headerbar) button.suggested-action:backdrop,
         headerbar.selection-mode button.suggested-action:backdrop {
           border-color: #262929;
-          background-color: #393f3f;
-          background-image: none;
+          background-color: transparent;
+          background-image: image(#393f3f);
           text-shadow: none;
           -gtk-icon-shadow: none;
           box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -2774,8 +2774,8 @@ switch {
   switch:backdrop slider {
     transition: 200ms ease-out;
     border-color: #262929;
-    background-color: #393f3f;
-    background-image: none;
+    background-color: transparent;
+    background-image: image(#393f3f);
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -2893,8 +2893,8 @@ radio {
   check:backdrop,
   radio:backdrop {
     border-color: #262929;
-    background-color: #393f3f;
-    background-image: none;
+    background-color: transparent;
+    background-image: image(#393f3f);
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -3161,8 +3161,8 @@ scale {
     scale slider:backdrop {
       transition: 200ms ease-out;
       border-color: #262929;
-      background-color: #393f3f;
-      background-image: none;
+      background-color: transparent;
+      background-image: image(#393f3f);
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -4359,8 +4359,8 @@ infobar {
     .warning button:backdrop,
     .error button:backdrop {
       border-color: #0f2b48;
-      background-color: #215d9c;
-      background-image: none;
+      background-color: transparent;
+      background-image: image(#215d9c);
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -4504,8 +4504,8 @@ colorswatch#add-color-button {
       box-shadow: inset 0 1px rgba(255, 255, 255, 0.05); }
     colorswatch#add-color-button overlay:backdrop {
       border-color: #262929;
-      background-color: #393f3f;
-      background-image: none;
+      background-color: transparent;
+      background-image: image(#393f3f);
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index 332cc84..96df7ca 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -479,8 +479,8 @@ button {
   button:backdrop.flat,
   button:backdrop {
     border-color: #c0c0bd;
-    background-color: #e8e8e7;
-    background-image: none;
+    background-color: transparent;
+    background-image: image(#e8e8e7);
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -826,8 +826,8 @@ button.suggested-action {
   button.suggested-action:backdrop,
   button.suggested-action.flat:backdrop {
     border-color: #4a90d9;
-    background-color: #4a90d9;
-    background-image: none;
+    background-color: transparent;
+    background-image: image(#4a90d9);
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1013,8 +1013,8 @@ button.destructive-action {
   button.destructive-action:backdrop,
   button.destructive-action.flat:backdrop {
     border-color: #ef2929;
-    background-color: #ef2929;
-    background-image: none;
+    background-color: transparent;
+    background-image: image(#ef2929);
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1256,8 +1256,8 @@ button.needs-attention > image, stacksidebar row.needs-attention > label {
         color: #8b8e8f; }
   .inline-toolbar toolbutton > button:backdrop {
     border-color: #c0c0bd;
-    background-color: #e8e8e7;
-    background-image: none;
+    background-color: transparent;
+    background-image: image(#e8e8e7);
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -1847,8 +1847,8 @@ headerbar {
       headerbar.selection-mode button:backdrop.flat,
       headerbar.selection-mode button:backdrop {
         border-color: #4a90d9;
-        background-color: #4a90d9;
-        background-image: none;
+        background-color: transparent;
+        background-image: image(#4a90d9);
         text-shadow: none;
         -gtk-icon-shadow: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -1995,8 +1995,8 @@ headerbar {
         .selection-mode.titlebar:not(headerbar) button.suggested-action:backdrop,
         headerbar.selection-mode button.suggested-action:backdrop {
           border-color: #c0c0bd;
-          background-color: #e8e8e7;
-          background-image: none;
+          background-color: transparent;
+          background-image: image(#e8e8e7);
           text-shadow: none;
           -gtk-icon-shadow: none;
           box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -2788,8 +2788,8 @@ switch {
   switch:backdrop slider {
     transition: 200ms ease-out;
     border-color: #c0c0bd;
-    background-color: #e8e8e7;
-    background-image: none;
+    background-color: transparent;
+    background-image: image(#e8e8e7);
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -2918,8 +2918,8 @@ radio {
   check:backdrop,
   radio:backdrop {
     border-color: #c0c0bd;
-    background-color: #e8e8e7;
-    background-image: none;
+    background-color: transparent;
+    background-image: image(#e8e8e7);
     text-shadow: none;
     -gtk-icon-shadow: none;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -3190,8 +3190,8 @@ scale {
     scale slider:backdrop {
       transition: 200ms ease-out;
       border-color: #c0c0bd;
-      background-color: #e8e8e7;
-      background-image: none;
+      background-color: transparent;
+      background-image: image(#e8e8e7);
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
@@ -4388,8 +4388,8 @@ infobar {
     .warning button:backdrop,
     .error button:backdrop {
       border-color: #4a90d9;
-      background-color: #4a90d9;
-      background-image: none;
+      background-color: transparent;
+      background-image: image(#4a90d9);
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0);
@@ -4533,8 +4533,8 @@ colorswatch#add-color-button {
       box-shadow: inset 0 1px white; }
     colorswatch#add-color-button overlay:backdrop {
       border-color: #c0c0bd;
-      background-color: #e8e8e7;
-      background-image: none;
+      background-color: transparent;
+      background-image: image(#e8e8e7);
       text-shadow: none;
       -gtk-icon-shadow: none;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0); }