Styles/Controls: make active/checked .text-button flat (#856)

Author: danirabbit

lib/Styles/Common/_controls.scss

@@ -22,11 +22,11 @@
 }
 
 // used to show a button is being clicked or is in an "active" state
-@mixin control-active-depressed {
+@mixin control-active {
+    background: bg-color(3);
     box-shadow:
         highlight("bottom"),
         inset-shadow("");
-        background-color: bg-color(3);
 
     &:disabled {
         box-shadow:
@@ -36,7 +36,7 @@
 }
 
 // used to show a check or radio button is "active"
-@mixin control-active-checked {
+@mixin control-checked {
     color: $SILVER_100;
     background-color: #{'@accent_color'};
 

lib/Styles/Gtk/Button.scss

@@ -26,12 +26,9 @@ button {
         @include control;
         @include border-interactive-roundrect;
 
-        &:checked, &:active {
-            @include control-active-depressed;
-        }
-
-        &:hover {
-            filter: brightness(105%);
+        &:active,
+        &:checked {
+            @include control-active;
         }
 
         &:active {
@@ -41,6 +38,10 @@ button {
         &:disabled {
             @include control-disabled;
         }
+
+        &:hover {
+            filter: brightness(105%);
+        }
     }
 
     // Stopgap since we can't do angled buttons in GtkCSS, and generating all

lib/Styles/Gtk/CheckButton.scss

@@ -13,13 +13,13 @@ checkbutton {
         }
 
         &:active {
-            @include control-active-depressed;
+            @include control-active;
             filter: brightness(95%);
         }
 
         &:checked {
             -gtk-icon-source: -gtk-icontheme("check-checked-symbolic");
-            @include control-active-checked;
+            @include control-checked;
         }
 
         &:indeterminate {