Adwaita: Update .devel headerbar styling

Just pull in the changes from gtk-3-24

3 files changed, 35 insertions, 8 deletions

diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index 15bdc8faaf..570b865ab9 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -1765,14 +1765,33 @@ headerbar { // headerbar border rounding
 
 // Development versions of apps to use a differently styled headerbar
 
-window.devel {    
+window.devel {
   headerbar.titlebar:not(.selection-mode) {
-    background: transparent -gtk-icontheme("system-run-symbolic") 90% 0/256px 256px no-repeat,
-                linear-gradient(to left, mix($selected_bg_color, $bg_color, 10%) 8%, $bg_color 25%);
+    $c: darken($bg_color, 10%);
+    $gradient: -gtk-icontheme("system-run-symbolic") 90% 0/256px 256px no-repeat,
+               linear-gradient(to right, transparent 65%, transparentize($selected_bg_color, 0.8)),
+               linear-gradient(to top, darken($c, 3%), $c 3px, lighten($c, 6%));
+    @if $variant == 'dark' {
+      $gradient: -gtk-icontheme("system-run-symbolic") 90% 0/256px 256px no-repeat,
+                 linear-gradient(to right, transparent 65%, transparentize($selected_bg_color, 0.9)),
+                 linear-gradient(to top, lighten($c, 3%) 3px, lighten($c, 5%));
+    }
+
+    background: $bg_color $gradient;
     color: transparentize($fg_color,.9);
-    
+
     label { color: $fg_color; }
+
+    &:backdrop {
+      background: $bg_color -gtk-icontheme("system-run-symbolic") 90% 0/256px 256px no-repeat,
+                  image($bg_color); /* background-color would flash */
+      color: transparentize($fg_color,.95);
+
+      label { color: $backdrop_fg_color; }
+    }
   }
+
+
 }
 
 /************
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index f7e8e15b9f..312b159559 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -723,10 +723,14 @@ window.csd > .titlebar:not(headerbar) { padding: 0; background-color: transparen
 
 .titlebar:not(headerbar) separator { background-color: #1b1b1b; }
 
-window.devel headerbar.titlebar:not(.selection-mode) { background: transparent -gtk-icontheme("system-run-symbolic") 90% 0/256px 256px no-repeat, linear-gradient(to left, #32383f 8%, #353535 25%); color: rgba(238, 238, 236, 0.1); }
+window.devel headerbar.titlebar:not(.selection-mode) { background: #353535 -gtk-icontheme("system-run-symbolic") 90% 0/256px 256px no-repeat, linear-gradient(to right, transparent 65%, rgba(21, 83, 158, 0.1)), linear-gradient(to top, #232323 3px, #282828); color: rgba(238, 238, 236, 0.1); }
 
 window.devel headerbar.titlebar:not(.selection-mode) label { color: #eeeeec; }
 
+window.devel headerbar.titlebar:not(.selection-mode):backdrop { background: #353535 -gtk-icontheme("system-run-symbolic") 90% 0/256px 256px no-repeat, image(#353535); /* background-color would flash */ color: rgba(238, 238, 236, 0.05); }
+
+window.devel headerbar.titlebar:not(.selection-mode):backdrop label { color: #919190; }
+
 /************ Pathbars * */
 .path-bar button.text-button, .path-bar button.image-button, .path-bar button { padding-left: 4px; padding-right: 4px; }
 
@@ -2069,7 +2073,7 @@ popover.menu box.inline-buttons { border-radius: 5px; border-style: none; border
 
 popover.menu box.circular-buttons { padding-bottom: 5px; }
 
-popover.menu arrow, popover.menu.background contents { background-color: #2f2f2f; }
+popover.menu > arrow, popover.menu.background > contents { background-color: #2f2f2f; }
 
 popover.menu.background separator { margin: 5px 0px; }
 
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index ad8c522ea1..0ed755d41a 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -731,10 +731,14 @@ window.csd > .titlebar:not(headerbar) { padding: 0; background-color: transparen
 
 .titlebar:not(headerbar) separator { background-color: #cdc7c2; }
 
-window.devel headerbar.titlebar:not(.selection-mode) { background: transparent -gtk-icontheme("system-run-symbolic") 90% 0/256px 256px no-repeat, linear-gradient(to left, #e3eaf2 8%, #f6f5f4 25%); color: rgba(46, 52, 54, 0.1); }
+window.devel headerbar.titlebar:not(.selection-mode) { background: #f6f5f4 -gtk-icontheme("system-run-symbolic") 90% 0/256px 256px no-repeat, linear-gradient(to right, transparent 65%, rgba(53, 132, 228, 0.2)), linear-gradient(to top, #d8d4d0, #dfdcd8 3px, #edebe9); color: rgba(46, 52, 54, 0.1); }
 
 window.devel headerbar.titlebar:not(.selection-mode) label { color: #2e3436; }
 
+window.devel headerbar.titlebar:not(.selection-mode):backdrop { background: #f6f5f4 -gtk-icontheme("system-run-symbolic") 90% 0/256px 256px no-repeat, image(#f6f5f4); /* background-color would flash */ color: rgba(46, 52, 54, 0.05); }
+
+window.devel headerbar.titlebar:not(.selection-mode):backdrop label { color: #929595; }
+
 /************ Pathbars * */
 .path-bar button.text-button, .path-bar button.image-button, .path-bar button { padding-left: 4px; padding-right: 4px; }
 
@@ -2085,7 +2089,7 @@ popover.menu box.inline-buttons { border-radius: 5px; border-style: none; border
 
 popover.menu box.circular-buttons { padding-bottom: 5px; }
 
-popover.menu arrow, popover.menu.background contents { background-color: #ffffff; }
+popover.menu > arrow, popover.menu.background > contents { background-color: #ffffff; }
 
 popover.menu.background separator { margin: 5px 0px; }