Adwaita: fix selection mode toolbar

Selection menu button still needs fixing

4 files changed, 88 insertions, 37 deletions

diff --git a/gtk/resources/theme/Adwaita/_colors.scss b/gtk/resources/theme/Adwaita/_colors.scss
index d605a5b6d3..fd7638427c 100644
--- a/gtk/resources/theme/Adwaita/_colors.scss
+++ b/gtk/resources/theme/Adwaita/_colors.scss
@@ -11,8 +11,9 @@ $selected_bg_color: if($variant =='light', #4a90d9, darken(#4a90d9,20%));
 $selected_borders_color: if($variant == 'light', darken($selected_bg_color, 30%), darken($selected_bg_color,20%));
                          // FIXME dark variant color
 $borders_color: if($variant =='light', darken($bg_color,30%), darken($bg_color,12%));
-$borders_edge: if($variant =='light', white, transparentize($fg_color,.9));
+$borders_edge: if($variant =='light', white, transparentize($fg_color, 0.9));
 $link_color: darken($selected_bg_color,10%);
+$top_hilight: if($variant =='light', white, transparentize($fg_color, 0.9));
 
 $warning_color: #f57900;
 $error_color: #cc0000;
@@ -60,7 +61,7 @@ $backdrop_borders_color: mix($borders_color, $bg_color, 90%);
 
 //WM
 
-$_wm_highlight: if($variant=='light', $borders_edge, // Sass gets mad if this is
+$_wm_highlight: if($variant=='light', $top_hilight,  // Sass gets mad if this is
                   transparentize(black,1));          // done directly in the
                                                      // color definition
 
diff --git a/gtk/resources/theme/Adwaita/_common.scss b/gtk/resources/theme/Adwaita/_common.scss
index 071681a377..d13690a5a3 100644
--- a/gtk/resources/theme/Adwaita/_common.scss
+++ b/gtk/resources/theme/Adwaita/_common.scss
@@ -684,14 +684,14 @@ GtkComboBox {
                                     lighten($bg_color,4%),
                                     $bg_color);
   box-shadow: inset 0 -1px mix($borders_color, $bg_color, 30%), // bottom shade
-              inset 0 1px $borders_edge; // top highlight
+              inset 0 1px $top_hilight; // top highlight
   padding: 6px;
 
   &:backdrop {
     border-color: $backdrop_borders_color;
     background-color: $bg_color;
     background-image: none;
-    box-shadow: none;
+    box-shadow: inset 0 1px $top_hilight;
   }
 
   .title {
@@ -724,28 +724,56 @@ GtkComboBox {
   &.selection-mode {
     color: darken($selected_bg_color, 15%);
     text-shadow: 0 1px transparentize(black, 0.5);
+    border-color: $selected_borders_color;
     background-image: linear-gradient(to bottom,
-                                    lighten($selected_bg_color,5%),
-                                    lighten($selected_bg_color,2%));
-    box-shadow: inset 0 -1px mix($borders_color,$bg_color, 30%), //bottom shade
-                inset 0 1px mix($borders_edge,$selected_bg_color, 50%); //top highlight
+                                      lighten($selected_bg_color,5%),
+                                      lighten($selected_bg_color,2%));
+    box-shadow: inset 0 -1px mix($selected_borders_color,
+                                 $selected_bg_color, 30%), //bottom shade
+                inset 0 1px mix($top_hilight,$selected_bg_color, 70%);
+    &:backdrop {
+      background-image: linear-gradient(to bottom, $selected_bg_color);
+      box-shadow: inset 0 1px mix($top_hilight,$selected_bg_color, 60%);
+    }
     .button {
       @include button(normal, $selected_bg_color, $selected_fg_color, noedge);
-      &:hover { @include button(hover, $selected_bg_color, $selected_fg_color, noedge); }
-      &:active { @include button(active, $selected_bg_color, $selected_fg_color, noedge); }
-      &:insensitive { @include button(insensitive, $selected_bg_color, $selected_fg_color, noedge); }
+      &:hover { @include button(hover, $selected_bg_color, $selected_fg_color,
+                                $noedge: true); }
+      &:active { @include button(active, $selected_bg_color, $selected_fg_color,                                 $noedge: true); }
+      &:insensitive { @include button(insensitive, $selected_bg_color, 
+                                      $selected_fg_color, $noedge: true); }
       &:backdrop { 
-        @include button(backdrop, $selected_bg_color, $selected_fg_color, noedge);
-        border-color: darken($selected_bg_color, 15%);
+        @include button(backdrop, $selected_bg_color, $selected_fg_color, 
+                        $noedge: true);
+        border-color: $selected_borders_color;
+      }
+      &:backdrop:insensitive { 
+        @include button(backdrop-insensitive, $selected_bg_color, 
+                        $selected_fg_color, $noedge: true); 
       }
-      &:backdrop:insensitive { @include button(backdrop-insensitive, $selected_bg_color, $selected_fg_color, noedge); }
       &.suggested-action {
         @include button($t:normal, $noedge:true);
-        &:hover { @include button($t:hover,$noedge:true); }
-        &:active { @include button($t:active, $noedge:true); }
-        &:insensitive { @include button($t:insensitive, $noedge:true); }
-        &:backdrop { @include button($t:backdrop, $noedge:true); }
-        &:backdrop:insensitive { @include button($t:backdrop-insensitive, $noedge:true); }
+        border-color: $selected_borders_color;
+        &:hover {
+          @include button($t:hover, $noedge: true);
+          border-color: $selected_borders_color;
+        }
+        &:active {
+          @include button($t:active, $noedge: true);
+          border-color: $selected_borders_color;
+        }
+        &:insensitive {
+          @include button($t:insensitive, $noedge: true);
+          border-color: $selected_borders_color;
+        }
+        &:backdrop {
+          @include button($t:backdrop, $noedge: true);
+          border-color: $selected_borders_color;
+        }
+        &:backdrop:insensitive {
+          @include button($t:backdrop-insensitive, $noedge: true);
+          border-color: $selected_borders_color;
+        }
       }
     }
     .selection-menu {
diff --git a/gtk/resources/theme/Adwaita/gtk-contained-dark.css b/gtk/resources/theme/Adwaita/gtk-contained-dark.css
index 4396d882e2..e3f06a9e66 100644
--- a/gtk/resources/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/resources/theme/Adwaita/gtk-contained-dark.css
@@ -829,7 +829,7 @@ GtkComboBox {
     border-color: #1e2222;
     background-color: #393f3f;
     background-image: none;
-    box-shadow: none; }
+    box-shadow: inset 0 1px rgba(238, 238, 236, 0.1); }
   .titlebar .title,
   .header-bar .title {
     font: Bold;
@@ -853,8 +853,13 @@ GtkComboBox {
   .header-bar.selection-mode {
     color: #14375d;
     text-shadow: 0 1px rgba(0, 0, 0, 0.5);
+    border-color: #0f2b48;
     background-image: linear-gradient(to bottom, #256ab1, #2362a5);
-    box-shadow: inset 0 -1px #303535, inset 0 1px rgba(43, 100, 160, 0.55); }
+    box-shadow: inset 0 -1px #1b4e82, inset 0 1px rgba(55, 108, 164, 0.37); }
+    .titlebar.selection-mode:backdrop,
+    .header-bar.selection-mode:backdrop {
+      background-image: linear-gradient(to bottom, #215d9c);
+      box-shadow: inset 0 1px rgba(48, 103, 161, 0.46); }
     .titlebar.selection-mode .button,
     .header-bar.selection-mode .button {
       border-style: solid;
@@ -901,7 +906,7 @@ GtkComboBox {
         text-shadow: none;
         icon-shadow: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0);
-        border-color: #14375d; }
+        border-color: #0f2b48; }
       .titlebar.selection-mode .button:backdrop:insensitive,
       .header-bar.selection-mode .button:backdrop:insensitive {
         border-style: solid;
@@ -918,7 +923,8 @@ GtkComboBox {
         border-color: #1c1f1f;
         text-shadow: 0 -1px rgba(0, 0, 0, 0.81176);
         icon-shadow: 0 -1px rgba(0, 0, 0, 0.81176);
-        box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
+        box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
+        border-color: #0f2b48; }
         .titlebar.selection-mode .button.suggested-action:hover,
         .header-bar.selection-mode .button.suggested-action:hover {
           border-style: solid;
@@ -927,7 +933,8 @@ GtkComboBox {
           background-image: linear-gradient(to bottom, #5b6464, #434a4a 40%, #393f3f);
           text-shadow: 0 -1px rgba(0, 0, 0, 0.77976);
           icon-shadow: 0 -1px rgba(0, 0, 0, 0.77976);
-          box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); }
+          box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
+          border-color: #0f2b48; }
         .titlebar.selection-mode .button.suggested-action:active,
         .header-bar.selection-mode .button.suggested-action:active {
           border-style: solid;
@@ -936,7 +943,8 @@ GtkComboBox {
           background-image: linear-gradient(to bottom, #212424, #2d3232 3%);
           text-shadow: 0 -1px rgba(0, 0, 0, 0.89176);
           icon-shadow: 0 -1px rgba(0, 0, 0, 0.89176);
-          box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3); }
+          box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3);
+          border-color: #0f2b48; }
         .titlebar.selection-mode .button.suggested-action:insensitive,
         .header-bar.selection-mode .button.suggested-action:insensitive {
           border-style: solid;
@@ -945,7 +953,8 @@ GtkComboBox {
           background-image: linear-gradient(to bottom, #323636);
           text-shadow: none;
           icon-shadow: none;
-          box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
+          box-shadow: inset 0 1px rgba(255, 255, 255, 0);
+          border-color: #0f2b48; }
         .titlebar.selection-mode .button.suggested-action:backdrop,
         .header-bar.selection-mode .button.suggested-action:backdrop {
           border-style: solid;
@@ -954,14 +963,16 @@ GtkComboBox {
           background-image: linear-gradient(to bottom, #393f3f);
           text-shadow: none;
           icon-shadow: none;
-          box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); }
+          box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0);
+          border-color: #0f2b48; }
         .titlebar.selection-mode .button.suggested-action:backdrop:insensitive,
         .header-bar.selection-mode .button.suggested-action:backdrop:insensitive {
           border-style: solid;
           color: #454c4c;
           border-color: #1e2222;
           background-image: linear-gradient(to bottom, #393f3f);
-          box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
+          box-shadow: inset 0 1px rgba(255, 255, 255, 0);
+          border-color: #0f2b48; }
     .titlebar.selection-mode .selection-menu,
     .header-bar.selection-mode .selection-menu {
       border-width: 0;
diff --git a/gtk/resources/theme/Adwaita/gtk-contained.css b/gtk/resources/theme/Adwaita/gtk-contained.css
index c52234ef59..0115e2de3f 100644
--- a/gtk/resources/theme/Adwaita/gtk-contained.css
+++ b/gtk/resources/theme/Adwaita/gtk-contained.css
@@ -821,7 +821,7 @@ GtkComboBox {
     border-color: #a8a8a8;
     background-color: #ededed;
     background-image: none;
-    box-shadow: none; }
+    box-shadow: inset 0 1px white; }
   .titlebar .title,
   .header-bar .title {
     font: Bold;
@@ -845,8 +845,13 @@ GtkComboBox {
   .header-bar.selection-mode {
     color: #256ab1;
     text-shadow: 0 1px rgba(0, 0, 0, 0.5);
+    border-color: #184472;
     background-image: linear-gradient(to bottom, #5f9ddd, #5295db);
-    box-shadow: inset 0 -1px #d6d6d6, inset 0 1px #a4c7ec; }
+    box-shadow: inset 0 -1px #3b79ba, inset 0 1px #c8ddf3; }
+    .titlebar.selection-mode:backdrop,
+    .header-bar.selection-mode:backdrop {
+      background-image: linear-gradient(to bottom, #4a90d9);
+      box-shadow: inset 0 1px #b6d2ef; }
     .titlebar.selection-mode .button,
     .header-bar.selection-mode .button {
       border-style: solid;
@@ -893,7 +898,7 @@ GtkComboBox {
         text-shadow: none;
         icon-shadow: none;
         box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0);
-        border-color: #256ab1; }
+        border-color: #184472; }
       .titlebar.selection-mode .button:backdrop:insensitive,
       .header-bar.selection-mode .button:backdrop:insensitive {
         border-style: solid;
@@ -910,7 +915,8 @@ GtkComboBox {
         border-color: #a1a1a1;
         text-shadow: 0 1px rgba(255, 255, 255, 0.76923);
         icon-shadow: 0 1px rgba(255, 255, 255, 0.76923);
-        box-shadow: inset 0 1px white; }
+        box-shadow: inset 0 1px white;
+        border-color: #184472; }
         .titlebar.selection-mode .button.suggested-action:hover,
         .header-bar.selection-mode .button.suggested-action:hover {
           border-style: solid;
@@ -919,7 +925,8 @@ GtkComboBox {
           background-image: linear-gradient(to bottom, white, #f7f7f7 40%, #ededed);
           text-shadow: 0 1px rgba(255, 255, 255, 0.76923);
           icon-shadow: 0 1px rgba(255, 255, 255, 0.76923);
-          box-shadow: inset 0 1px white; }
+          box-shadow: inset 0 1px white;
+          border-color: #184472; }
         .titlebar.selection-mode .button.suggested-action:active,
         .header-bar.selection-mode .button.suggested-action:active {
           border-style: solid;
@@ -928,7 +935,8 @@ GtkComboBox {
           background-image: linear-gradient(to bottom, #c7c7c7, #d1d1d1 3%, lightgray);
           text-shadow: 0 1px rgba(255, 255, 255, 0.76923);
           icon-shadow: 0 1px rgba(255, 255, 255, 0.76923);
-          box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3); }
+          box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3);
+          border-color: #184472; }
         .titlebar.selection-mode .button.suggested-action:insensitive,
         .header-bar.selection-mode .button.suggested-action:insensitive {
           border-style: solid;
@@ -937,7 +945,8 @@ GtkComboBox {
           background-image: linear-gradient(to bottom, #f4f4f4);
           text-shadow: none;
           icon-shadow: none;
-          box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
+          box-shadow: inset 0 1px rgba(255, 255, 255, 0);
+          border-color: #184472; }
         .titlebar.selection-mode .button.suggested-action:backdrop,
         .header-bar.selection-mode .button.suggested-action:backdrop {
           border-style: solid;
@@ -946,14 +955,16 @@ GtkComboBox {
           background-image: linear-gradient(to bottom, #ededed);
           text-shadow: none;
           icon-shadow: none;
-          box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); }
+          box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0);
+          border-color: #184472; }
         .titlebar.selection-mode .button.suggested-action:backdrop:insensitive,
         .header-bar.selection-mode .button.suggested-action:backdrop:insensitive {
           border-style: solid;
           color: #c7c7c7;
           border-color: #a8a8a8;
           background-image: linear-gradient(to bottom, #ededed);
-          box-shadow: inset 0 1px rgba(255, 255, 255, 0); }
+          box-shadow: inset 0 1px rgba(255, 255, 255, 0);
+          border-color: #184472; }
     .titlebar.selection-mode .selection-menu,
     .header-bar.selection-mode .selection-menu {
       border-width: 0;