fix flat button transition

14 files changed, 28 insertions, 14 deletions

diff --git a/common/gtk-3.0/3.14/gtk-contained-dark.css b/common/gtk-3.0/3.14/gtk-contained-dark.css
index 824f097..3ffe7ca 100644
--- a/common/gtk-3.0/3.14/gtk-contained-dark.css
+++ b/common/gtk-3.0/3.14/gtk-contained-dark.css
@@ -285,7 +285,8 @@ GtkSearchEntry.entry {
     border-color: transparent;
     background-color: transparent;
     background-image: none;
-    background-color: rgba(56, 60, 74, 0);
+    background-color: rgba(68, 74, 88, 0);
+    border-color: rgba(43, 46, 57, 0);
     transition: none; }
     .button.flat:hover {
       transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
diff --git a/common/gtk-3.0/3.14/gtk-contained-darker.css b/common/gtk-3.0/3.14/gtk-contained-darker.css
index ccbfdc0..4c6afb5 100644
--- a/common/gtk-3.0/3.14/gtk-contained-darker.css
+++ b/common/gtk-3.0/3.14/gtk-contained-darker.css
@@ -285,7 +285,8 @@ GtkSearchEntry.entry {
     border-color: transparent;
     background-color: transparent;
     background-image: none;
-    background-color: rgba(245, 246, 247, 0);
+    background-color: rgba(251, 251, 252, 0);
+    border-color: rgba(207, 214, 230, 0);
     transition: none; }
     .button.flat:hover {
       transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
diff --git a/common/gtk-3.0/3.14/gtk-contained-solid-dark.css b/common/gtk-3.0/3.14/gtk-contained-solid-dark.css
index 4c6cc87..3142a1a 100644
--- a/common/gtk-3.0/3.14/gtk-contained-solid-dark.css
+++ b/common/gtk-3.0/3.14/gtk-contained-solid-dark.css
@@ -285,7 +285,8 @@ GtkSearchEntry.entry {
     border-color: transparent;
     background-color: transparent;
     background-image: none;
-    background-color: rgba(56, 60, 74, 0);
+    background-color: rgba(68, 74, 88, 0);
+    border-color: rgba(43, 46, 57, 0);
     transition: none; }
     .button.flat:hover {
       transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
diff --git a/common/gtk-3.0/3.14/gtk-contained-solid-darker.css b/common/gtk-3.0/3.14/gtk-contained-solid-darker.css
index 122bf64..6176a1c 100644
--- a/common/gtk-3.0/3.14/gtk-contained-solid-darker.css
+++ b/common/gtk-3.0/3.14/gtk-contained-solid-darker.css
@@ -285,7 +285,8 @@ GtkSearchEntry.entry {
     border-color: transparent;
     background-color: transparent;
     background-image: none;
-    background-color: rgba(245, 246, 247, 0);
+    background-color: rgba(251, 251, 252, 0);
+    border-color: rgba(207, 214, 230, 0);
     transition: none; }
     .button.flat:hover {
       transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
diff --git a/common/gtk-3.0/3.14/gtk-contained-solid.css b/common/gtk-3.0/3.14/gtk-contained-solid.css
index df24f99..36cc18d 100644
--- a/common/gtk-3.0/3.14/gtk-contained-solid.css
+++ b/common/gtk-3.0/3.14/gtk-contained-solid.css
@@ -285,7 +285,8 @@ GtkSearchEntry.entry {
     border-color: transparent;
     background-color: transparent;
     background-image: none;
-    background-color: rgba(245, 246, 247, 0);
+    background-color: rgba(251, 251, 252, 0);
+    border-color: rgba(207, 214, 230, 0);
     transition: none; }
     .button.flat:hover {
       transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
diff --git a/common/gtk-3.0/3.14/gtk-contained.css b/common/gtk-3.0/3.14/gtk-contained.css
index 0f6a4e6..c7d3966 100644
--- a/common/gtk-3.0/3.14/gtk-contained.css
+++ b/common/gtk-3.0/3.14/gtk-contained.css
@@ -285,7 +285,8 @@ GtkSearchEntry.entry {
     border-color: transparent;
     background-color: transparent;
     background-image: none;
-    background-color: rgba(245, 246, 247, 0);
+    background-color: rgba(251, 251, 252, 0);
+    border-color: rgba(207, 214, 230, 0);
     transition: none; }
     .button.flat:hover {
       transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
diff --git a/common/gtk-3.0/3.14/sass/_common.scss b/common/gtk-3.0/3.14/sass/_common.scss
index eda6e01..6a7ed8a 100644
--- a/common/gtk-3.0/3.14/sass/_common.scss
+++ b/common/gtk-3.0/3.14/sass/_common.scss
@@ -398,7 +398,8 @@ $_dot_color: $selected_bg_color;
 
   &.flat { 
     @include button(undecorated);
-    background-color: transparentize($bg_color, 1);
+    background-color: transparentize($button_bg, 1);
+    border-color: transparentize($button_border, 1);
     // to avoid adiacent buttons borders clashing when transitioning, the transition on the normal state is set
     // to none, while it's added back in the hover state, so the button decoration will fade in on hover, but
     // it won't fade out when the pointer leave the button allocation area. To make the transition more evident
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 bb75e66..560be11 100644
--- a/common/gtk-3.0/3.16/gtk-contained-dark.css
+++ b/common/gtk-3.0/3.16/gtk-contained-dark.css
@@ -285,7 +285,8 @@ GtkSearchEntry.entry {
     border-color: transparent;
     background-color: transparent;
     background-image: none;
-    background-color: rgba(56, 60, 74, 0);
+    background-color: rgba(68, 74, 88, 0);
+    border-color: rgba(43, 46, 57, 0);
     transition: none; }
     .button.flat:hover {
       transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
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 5258c4c..c417df6 100644
--- a/common/gtk-3.0/3.16/gtk-contained-darker.css
+++ b/common/gtk-3.0/3.16/gtk-contained-darker.css
@@ -285,7 +285,8 @@ GtkSearchEntry.entry {
     border-color: transparent;
     background-color: transparent;
     background-image: none;
-    background-color: rgba(245, 246, 247, 0);
+    background-color: rgba(251, 251, 252, 0);
+    border-color: rgba(207, 214, 230, 0);
     transition: none; }
     .button.flat:hover {
       transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
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 d3e4f0e..238d770 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
@@ -285,7 +285,8 @@ GtkSearchEntry.entry {
     border-color: transparent;
     background-color: transparent;
     background-image: none;
-    background-color: rgba(56, 60, 74, 0);
+    background-color: rgba(68, 74, 88, 0);
+    border-color: rgba(43, 46, 57, 0);
     transition: none; }
     .button.flat:hover {
       transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
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 ecd99ac..d31566f 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
@@ -285,7 +285,8 @@ GtkSearchEntry.entry {
     border-color: transparent;
     background-color: transparent;
     background-image: none;
-    background-color: rgba(245, 246, 247, 0);
+    background-color: rgba(251, 251, 252, 0);
+    border-color: rgba(207, 214, 230, 0);
     transition: none; }
     .button.flat:hover {
       transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
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 0648b7f..5c70769 100644
--- a/common/gtk-3.0/3.16/gtk-contained-solid.css
+++ b/common/gtk-3.0/3.16/gtk-contained-solid.css
@@ -285,7 +285,8 @@ GtkSearchEntry.entry {
     border-color: transparent;
     background-color: transparent;
     background-image: none;
-    background-color: rgba(245, 246, 247, 0);
+    background-color: rgba(251, 251, 252, 0);
+    border-color: rgba(207, 214, 230, 0);
     transition: none; }
     .button.flat:hover {
       transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
diff --git a/common/gtk-3.0/3.16/gtk-contained.css b/common/gtk-3.0/3.16/gtk-contained.css
index 9dbadcd..15a8376 100644
--- a/common/gtk-3.0/3.16/gtk-contained.css
+++ b/common/gtk-3.0/3.16/gtk-contained.css
@@ -285,7 +285,8 @@ GtkSearchEntry.entry {
     border-color: transparent;
     background-color: transparent;
     background-image: none;
-    background-color: rgba(245, 246, 247, 0);
+    background-color: rgba(251, 251, 252, 0);
+    border-color: rgba(207, 214, 230, 0);
     transition: none; }
     .button.flat:hover {
       transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
diff --git a/common/gtk-3.0/3.16/sass/_common.scss b/common/gtk-3.0/3.16/sass/_common.scss
index 7011eac..ae6da28 100644
--- a/common/gtk-3.0/3.16/sass/_common.scss
+++ b/common/gtk-3.0/3.16/sass/_common.scss
@@ -398,7 +398,8 @@ $_dot_color: $selected_bg_color;
 
   &.flat { 
     @include button(undecorated);
-    background-color: transparentize($bg_color, 1);
+    background-color: transparentize($button_bg, 1);
+    border-color: transparentize($button_border, 1);
     // to avoid adiacent buttons borders clashing when transitioning, the transition on the normal state is set
     // to none, while it's added back in the hover state, so the button decoration will fade in on hover, but
     // it won't fade out when the pointer leave the button allocation area. To make the transition more evident