handle headerbar-border transparency correctly

7 files changed, 49 insertions, 24 deletions

diff --git a/common/gtk-3.0/3.16/gtk-contained-dark.css b/common/gtk-3.0/3.16/gtk-contained-dark.css
index a38eb96..7f79f16 100644
--- a/common/gtk-3.0/3.16/gtk-contained-dark.css
+++ b/common/gtk-3.0/3.16/gtk-contained-dark.css
@@ -905,11 +905,12 @@ GtkComboBox {
   border-width: 0 0 1px;
   border-style: solid;
   border-radius: 0;
-  border-color: rgba(38, 42, 51, 0.97);
+  border-color: #262a33;
   color: rgba(207, 218, 231, 0.8);
   background-color: #2f343f; }
   .csd .header-bar {
-    background-color: rgba(47, 52, 63, 0.97); }
+    background-color: rgba(47, 52, 63, 0.97);
+    border-color: rgba(38, 42, 51, 0.97); }
   .header-bar:backdrop {
     color: rgba(207, 218, 231, 0.5);
     background-color: #323843; }
@@ -985,9 +986,11 @@ GtkComboBox {
   .maximized .header-bar, .maximized .header-bar:backdrop {
     border-radius: 0; }
   .maximized .header-bar {
-    background-color: #2f343f; }
+    background-color: #2f343f;
+    border-color: #262a33; }
     .maximized .header-bar:backdrop {
-      background-color: #323843; }
+      background-color: #323843;
+      border-color: #262a33; }
   .header-bar.default-decoration {
     padding-top: 5px;
     padding-bottom: 5px;
diff --git a/common/gtk-3.0/3.16/gtk-contained-darker.css b/common/gtk-3.0/3.16/gtk-contained-darker.css
index e57e5bf..0fde31b 100644
--- a/common/gtk-3.0/3.16/gtk-contained-darker.css
+++ b/common/gtk-3.0/3.16/gtk-contained-darker.css
@@ -908,11 +908,12 @@ GtkComboBox {
   border-width: 0 0 1px;
   border-style: solid;
   border-radius: 0;
-  border-color: rgba(38, 42, 51, 0.97);
+  border-color: #262a33;
   color: rgba(207, 218, 231, 0.8);
   background-color: #2f343f; }
   .csd .header-bar {
-    background-color: rgba(47, 52, 63, 0.97); }
+    background-color: rgba(47, 52, 63, 0.97);
+    border-color: rgba(38, 42, 51, 0.97); }
   .header-bar:backdrop {
     color: rgba(207, 218, 231, 0.5);
     background-color: #323843; }
@@ -988,9 +989,11 @@ GtkComboBox {
   .maximized .header-bar, .maximized .header-bar:backdrop {
     border-radius: 0; }
   .maximized .header-bar {
-    background-color: #2f343f; }
+    background-color: #2f343f;
+    border-color: #262a33; }
     .maximized .header-bar:backdrop {
-      background-color: #323843; }
+      background-color: #323843;
+      border-color: #262a33; }
   .header-bar.default-decoration {
     padding-top: 5px;
     padding-bottom: 5px;
diff --git a/common/gtk-3.0/3.16/gtk-contained-solid-dark.css b/common/gtk-3.0/3.16/gtk-contained-solid-dark.css
index 80bd21f..3ca9a03 100644
--- a/common/gtk-3.0/3.16/gtk-contained-solid-dark.css
+++ b/common/gtk-3.0/3.16/gtk-contained-solid-dark.css
@@ -909,7 +909,8 @@ GtkComboBox {
   color: rgba(207, 218, 231, 0.8);
   background-color: #2f343f; }
   .csd .header-bar {
-    background-color: #2f343f; }
+    background-color: #2f343f;
+    border-color: #262a33; }
   .header-bar:backdrop {
     color: rgba(207, 218, 231, 0.5);
     background-color: #323843; }
@@ -985,9 +986,11 @@ GtkComboBox {
   .maximized .header-bar, .maximized .header-bar:backdrop {
     border-radius: 0; }
   .maximized .header-bar {
-    background-color: #2f343f; }
+    background-color: #2f343f;
+    border-color: #262a33; }
     .maximized .header-bar:backdrop {
-      background-color: #323843; }
+      background-color: #323843;
+      border-color: #262a33; }
   .header-bar.default-decoration {
     padding-top: 5px;
     padding-bottom: 5px;
diff --git a/common/gtk-3.0/3.16/gtk-contained-solid-darker.css b/common/gtk-3.0/3.16/gtk-contained-solid-darker.css
index bb0841b..5b2d895 100644
--- a/common/gtk-3.0/3.16/gtk-contained-solid-darker.css
+++ b/common/gtk-3.0/3.16/gtk-contained-solid-darker.css
@@ -912,7 +912,8 @@ GtkComboBox {
   color: rgba(207, 218, 231, 0.8);
   background-color: #2f343f; }
   .csd .header-bar {
-    background-color: #2f343f; }
+    background-color: #2f343f;
+    border-color: #262a33; }
   .header-bar:backdrop {
     color: rgba(207, 218, 231, 0.5);
     background-color: #323843; }
@@ -988,9 +989,11 @@ GtkComboBox {
   .maximized .header-bar, .maximized .header-bar:backdrop {
     border-radius: 0; }
   .maximized .header-bar {
-    background-color: #2f343f; }
+    background-color: #2f343f;
+    border-color: #262a33; }
     .maximized .header-bar:backdrop {
-      background-color: #323843; }
+      background-color: #323843;
+      border-color: #262a33; }
   .header-bar.default-decoration {
     padding-top: 5px;
     padding-bottom: 5px;
diff --git a/common/gtk-3.0/3.16/gtk-contained-solid.css b/common/gtk-3.0/3.16/gtk-contained-solid.css
index ff99ac8..25b1664 100644
--- a/common/gtk-3.0/3.16/gtk-contained-solid.css
+++ b/common/gtk-3.0/3.16/gtk-contained-solid.css
@@ -912,7 +912,8 @@ GtkComboBox {
   color: rgba(82, 93, 118, 0.8);
   background-color: #e7e8eb; }
   .csd .header-bar {
-    background-color: #e7e8eb; }
+    background-color: #e7e8eb;
+    border-color: #d4d5db; }
   .header-bar:backdrop {
     color: rgba(82, 93, 118, 0.5);
     background-color: #eff0f2; }
@@ -988,9 +989,11 @@ GtkComboBox {
   .maximized .header-bar, .maximized .header-bar:backdrop {
     border-radius: 0; }
   .maximized .header-bar {
-    background-color: #e7e8eb; }
+    background-color: #e7e8eb;
+    border-color: #d4d5db; }
     .maximized .header-bar:backdrop {
-      background-color: #eff0f2; }
+      background-color: #eff0f2;
+      border-color: #d4d5db; }
   .header-bar.default-decoration {
     padding-top: 5px;
     padding-bottom: 5px;
diff --git a/common/gtk-3.0/3.16/gtk-contained.css b/common/gtk-3.0/3.16/gtk-contained.css
index 5acf60b..c98d6f9 100644
--- a/common/gtk-3.0/3.16/gtk-contained.css
+++ b/common/gtk-3.0/3.16/gtk-contained.css
@@ -908,11 +908,12 @@ GtkComboBox {
   border-width: 0 0 1px;
   border-style: solid;
   border-radius: 0;
-  border-color: rgba(212, 213, 219, 0.95);
+  border-color: #d4d5db;
   color: rgba(82, 93, 118, 0.8);
   background-color: #e7e8eb; }
   .csd .header-bar {
-    background-color: rgba(231, 232, 235, 0.95); }
+    background-color: rgba(231, 232, 235, 0.95);
+    border-color: rgba(212, 213, 219, 0.95); }
   .header-bar:backdrop {
     color: rgba(82, 93, 118, 0.5);
     background-color: #eff0f2; }
@@ -988,9 +989,11 @@ GtkComboBox {
   .maximized .header-bar, .maximized .header-bar:backdrop {
     border-radius: 0; }
   .maximized .header-bar {
-    background-color: #e7e8eb; }
+    background-color: #e7e8eb;
+    border-color: #d4d5db; }
     .maximized .header-bar:backdrop {
-      background-color: #eff0f2; }
+      background-color: #eff0f2;
+      border-color: #d4d5db; }
   .header-bar.default-decoration {
     padding-top: 5px;
     padding-bottom: 5px;
diff --git a/common/gtk-3.0/3.16/sass/_common.scss b/common/gtk-3.0/3.16/sass/_common.scss
index 0728848..44a09bf 100644
--- a/common/gtk-3.0/3.16/sass/_common.scss
+++ b/common/gtk-3.0/3.16/sass/_common.scss
@@ -1033,12 +1033,15 @@ GtkComboBox {
   border-width: 0 0 1px;
   border-style: solid;
   border-radius: 0;
-  border-color: $header_border;
+  border-color: opacify($header_border, 1);
 
   color: $header_fg;
   background-color: opacify($header_bg, 1);
 
-  .csd & { background-color: $header_bg; }  // Transparent header-bars only in csd windows
+  .csd & {  // Transparent header-bars only in csd windows
+    background-color: $header_bg;
+    border-color: $header_border;
+  }
 
   &:backdrop {
     color: transparentize($header_fg, 0.3);
@@ -1127,8 +1130,12 @@ GtkComboBox {
 
   .maximized & {
     background-color: opacify($header_bg, 1);
+    border-color: opacify($header_border, 1);
 
-    &:backdrop { background-color: opacify($header_bg_backdrop, 1); }
+    &:backdrop {
+      background-color: opacify($header_bg_backdrop, 1);
+      border-color: opacify($header_border, 1);
+    }
   }
 
   &.default-decoration {