TMS-1164: Minor button color changes

Author: eebbi

assets/styles/helpers/_button.scss

@@ -106,10 +106,9 @@ $button-transition-speed: $speed !default;
     &,
     &:active,
     &.is-active {
-        text-decoration: underline;
-        // background-color: $button-background-primary;
-        // border-color: $button-border-primary;
-        // color: $button-text-primary;
+        background-color: $button-background-primary;
+        border-color: $button-border-primary;
+        color: $button-text-primary;
 
         .icon {
             fill: currentColor !important;

assets/styles/helpers/_color.scss

@@ -119,11 +119,16 @@
 
             .button {
                 &.is-#{$name} {
-                    color: $color !important;
-                    background-color: $color-invert !important;
-
-                    .icon {
-                        fill: currentColor !important;
+                    &,
+                    &:hover,
+                    &:focus,
+                    &:active {
+                        color: $color !important;
+                        background-color: $color-invert !important;
+
+                        .icon {
+                            fill: currentColor !important;
+                        }
                     }
                 }
 

assets/styles/themes/_theme-neutraali-overrides.scss

@@ -10,22 +10,22 @@ $pill-background-active-focus: $primary;
 .site-header,
 .main-content {
     // Button styles
-    .button {
-        &.is-primary.is-outlined {
-            &,
-            &:active,
-            &:hover,
-            &:focus,
-            &.is-active {
-                border-color: $primary-dark !important; // sass-lint:disable-line no-important
-                color: $primary-dark !important; // sass-lint:disable-line no-important
-
-                .icon {
-                    fill: $primary-dark !important; // sass-lint:disable-line no-important
-                }
-            }
-        }
-    }
+    // .button {
+    //     &.is-primary.is-outlined {
+    //         &,
+    //         &:active,
+    //         &:hover,
+    //         &:focus,
+    //         &.is-active {
+    //             border-color: $primary-dark !important; // sass-lint:disable-line no-important
+    //             color: $primary-dark !important; // sass-lint:disable-line no-important
+
+    //             .icon {
+    //                 fill: $primary-dark !important; // sass-lint:disable-line no-important
+    //             }
+    //         }
+    //     }
+    // }
 
     .fly-out-nav__trigger {
         &:hover,
@@ -62,11 +62,16 @@ $pill-background-active-focus: $primary;
     .dropdown {
         .dropdown-trigger {
             .button {
-                color: $black !important;
-                border-color: $black !important;
+                &,
+                &:active,
+                &:hover,
+                &:focus {
+                    color: $black !important;
+                    border-color: $black !important;
 
-                .icon {
-                    fill: $black !important;
+                    .icon {
+                        fill: $black !important;
+                    }
                 }
             }
         }

assets/styles/themes/_theme-paahde-overrides.scss

@@ -6,12 +6,14 @@
 .site-header,
 .main-content,
 .site-footer {
-    .button {
+    .button:not(.modal-close-button),
+    .button.is-primary.is-inverted {
         &,
         &#js-back-to-top,
         &:hover,
         &:focus,
-        &:active {
+        &:active,
+        &.is-active {
             color: $black !important;
             border-color: $black !important;
 

assets/styles/themes/_theme-teraksensininen-overrides.scss

@@ -9,3 +9,17 @@
         }
     }
 }
+
+.gform_wrapper {
+    .button,
+    .gform_delete_file {
+        &,
+        &:hover,
+        &:focus,
+        &:active,
+        &.is-active {
+            background-color: $primary !important;
+            color: $white !important;
+        }
+    }
+}

assets/styles/themes/theme-mustavalkoinen-overrides.scss

@@ -22,7 +22,13 @@
 
     &__end {
         .button {
-            border-color: $white !important;
+            &,
+            &:hover,
+            &:focus,
+            &:active,
+            &.is-active {
+                border-color: $white !important;
+            }
         }
     }
 
@@ -215,3 +221,17 @@
         }
     }
 }
+
+.gform_wrapper {
+    .button,
+    .gform_delete_file {
+        &,
+        &:hover,
+        &:focus,
+        &:active,
+        &.is-active {
+            background-color: $black !important;
+            color: $white !important;
+        }
+    }
+}