Merge branch 'TMS-1164' into stage

Author: eebbi

assets/styles/blocks/custom/_grid.scss

@@ -54,17 +54,6 @@
                     max-width: 80%;
                 }
             }
-
-            .button {
-                &:hover {
-                    color: $primary-invert !important;
-                    background-color: $primary !important;
-                }
-
-                &:focus {
-                    outline-color: $white;
-                }
-            }
         }
     }
 }

assets/styles/helpers/_button.scss

@@ -119,7 +119,6 @@ $button-transition-speed: $speed !default;
     &.is-hovered,
     &:focus,
     &.is-focused {
-        border-color: $button-border-invert;
         text-decoration: underline !important;
 
         @extend .button-state-hover;

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

@@ -16,12 +16,10 @@
 
 .lang-nav--horizontal {
     a {
-        color: $primary-invert !important;
-
+        &,
         &:hover,
         &:focus {
             color: $primary-invert !important;
-            background-color: $primary !important;
         }
     }
 }
@@ -100,7 +98,7 @@
         &:hover,
         &:focus {
             color: $black !important;
-            background-color: $primary !important;
+            background-color: transparent !important;
             border-color: $black !important;
         }
     }

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

@@ -141,7 +141,7 @@
         &:hover,
         &:focus {
             color: $black !important;
-            background-color: $primary !important;
+            background-color: transparent !important;
             border-color: $black !important;
         }
     }

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

@@ -138,7 +138,7 @@
         &:hover,
         &:focus {
             color: $black !important;
-            background-color: $primary !important;
+            background-color: transparent !important;
             border-color: $black !important;
         }
     }

assets/styles/ui-components/_pill.scss

@@ -5,9 +5,9 @@ $pill-color-active-hover: $primary-invert !default;
 $pill-color-hover: $secondary-invert !default;
 $pill-background-active: $primary !default;
 
-$pill-background-active-focus: $primary-dark !default;
-$pill-background-color-hover: opacify($secondary-light, .75) !default;
-$pill-background-color-focus: $secondary-light !default;
+$pill-background-active-focus: $primary !default;
+$pill-background-color-hover: $secondary !default;
+$pill-background-color-focus: $secondary !default;
 $pill-background-color-active: $dark !default;
 $pill-background-color-focus: $dark !default;
 $pill-border-color: transparent !default;
@@ -46,7 +46,7 @@ $pill-hover-shadow-color: rgba(0, 0, 0, .15) !default;
         &.is-active,
         &:focus,
         &:hover {
-            text-decoration: none;
+            text-decoration: underline;
         }
 
         &:focus,
@@ -83,18 +83,13 @@ $pill-hover-shadow-color: rgba(0, 0, 0, .15) !default;
 
         &:not(span) {
             &:hover,
-            &.is-hovered {
+            &.is-hovered,
+            &:focus,
+            &.is-focused {
                 color: $primary-invert;
                 background-color: bulmaDarken($primary, 2.5%);
                 border-color: transparent;
             }
-
-            &:focus,
-            &.is-focused {
-                color: $primary;
-                background-color: $primary-invert;
-                border-color: $color-black;
-            }
         }
 
         &-invert,
@@ -105,16 +100,12 @@ $pill-hover-shadow-color: rgba(0, 0, 0, .15) !default;
 
             &:not(span) {
                 &:hover,
-                &.is-hovered {
-                    color: $primary-invert;
-                    background-color: bulmaDarken($primary, 2.5%);
-                }
-
+                &.is-hovered,
                 &:focus,
                 &.is-focused {
-                    color: $primary-invert;
-                    background-color: bulmaDarken($primary, 2.5%);
-                    border-color: bulmaDarken($primary, 2.5%);
+                    color: $primary;
+                    background-color: $primary-invert;
+                    border-color: $primary;
                 }
             }
         }

assets/styles/ui-components/_share-links.scss

@@ -0,0 +1,12 @@
+.share-links {
+    a.has-background-accent {
+        &:hover,
+        &:focus {
+            background-color: bulmaDarken($primary, 10) !important;
+
+            .icon {
+                fill: $primary-invert !important;
+            }
+        }
+    }
+}

assets/styles/ui-components/header/_language-nav.scss

@@ -21,6 +21,13 @@ $lang-nav-link-border: $primary !default;
                 width: 2.2359rem;
                 height: 2.2359rem;
             }
+
+            &.has-background-primary {
+                &:hover,
+                &:focus {
+                    background-color: $primary !important; // sass-lint:disable-line no-important
+                }
+            }
         }
     }
 }

assets/styles/ui-components/index.scss

@@ -27,3 +27,4 @@
 @import "forms";
 @import "cookiebot";
 @import "archive-filters";
+@import "share-links";