handle headerbar-border transparency correctly

7 files changed, 49 insertions, 24 deletions

diff --git a/common/gtk-3.0/3.18/gtk-contained-dark.css b/common/gtk-3.0/3.18/gtk-contained-dark.css
index f516296..2b38471 100644
--- a/common/gtk-3.0/3.18/gtk-contained-dark.css
+++ b/common/gtk-3.0/3.18/gtk-contained-dark.css
@@ -993,11 +993,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; }
@@ -1074,9 +1075,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.18/gtk-contained-darker.css b/common/gtk-3.0/3.18/gtk-contained-darker.css
index 888b382..40b827a 100644
--- a/common/gtk-3.0/3.18/gtk-contained-darker.css
+++ b/common/gtk-3.0/3.18/gtk-contained-darker.css
@@ -996,11 +996,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; }
@@ -1077,9 +1078,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.18/gtk-contained-solid-dark.css b/common/gtk-3.0/3.18/gtk-contained-solid-dark.css
index 76021a8..5ccbdcd 100644
--- a/common/gtk-3.0/3.18/gtk-contained-solid-dark.css
+++ b/common/gtk-3.0/3.18/gtk-contained-solid-dark.css
@@ -997,7 +997,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; }
@@ -1074,9 +1075,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.18/gtk-contained-solid-darker.css b/common/gtk-3.0/3.18/gtk-contained-solid-darker.css
index 43402eb..0c8ad77 100644
--- a/common/gtk-3.0/3.18/gtk-contained-solid-darker.css
+++ b/common/gtk-3.0/3.18/gtk-contained-solid-darker.css
@@ -1000,7 +1000,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; }
@@ -1077,9 +1078,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.18/gtk-contained-solid.css b/common/gtk-3.0/3.18/gtk-contained-solid.css
index 0e1914c..d259905 100644
--- a/common/gtk-3.0/3.18/gtk-contained-solid.css
+++ b/common/gtk-3.0/3.18/gtk-contained-solid.css
@@ -1000,7 +1000,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; }
@@ -1077,9 +1078,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.18/gtk-contained.css b/common/gtk-3.0/3.18/gtk-contained.css
index 1feae06..eb92f36 100644
--- a/common/gtk-3.0/3.18/gtk-contained.css
+++ b/common/gtk-3.0/3.18/gtk-contained.css
@@ -996,11 +996,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; }
@@ -1077,9 +1078,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.18/sass/_common.scss b/common/gtk-3.0/3.18/sass/_common.scss
index da22ce6..d8ab60a 100644
--- a/common/gtk-3.0/3.18/sass/_common.scss
+++ b/common/gtk-3.0/3.18/sass/_common.scss
@@ -1077,12 +1077,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);
@@ -1171,8 +1174,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 {