govuk_publishing_components 24.11.0 → 24.13.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 78e0df66823b7cc209d7d062f04e17ce65954ee5c06a965fe18912240cc687fd
-  data.tar.gz: b527515c2c9211e77a392c8891bd9ca476782681a63fd05e43d9c0aa2f3b8e7c
+  metadata.gz: 5a5f30a829f44913c30260a6dcaa8f09cb443897477370f95d64b977e0ba3e3b
+  data.tar.gz: 7acbcf428ab0bcc171285ece6d46c19fbf1145b2c55e65de79f0ba6c51f2990a
 SHA512:
-  metadata.gz: a458245e3e6f8f5a5c3b6fb5e3c8eabb3ea0b74b201dde838f2b8a600ea0b4709ae5c01dbadd1d3b55148d1cc95d38da4dc2843805d46daa09fcb78e417a2f46
-  data.tar.gz: 0b63b8847309278957552d167763f3fa26077a7406a370d9e3edebbf5173c6978c30c75990654a511a91f99d00c2b64ad4d08fc72e7ff71cfbd9b163d8c4f3cf
+  metadata.gz: 05cc84e714cde48b7fd102495f024ab30284f171ea2fab94b6ef6a7aad9d0642dc78ab8c50b844be7b2eca1efa985e8a2aae4c6e5fa5f6e9f162e87db2d4c53c
+  data.tar.gz: 4cdb13383ef1ce24a5e688e2a0d1b5bf9b349a18290e3e41537f2c7c75881d1ee472a4c795e4d3c300e5d274e46aba3618b49e9e8e2cfb1ceed018112e1ff864

data/app/assets/javascripts/govuk_publishing_components/analytics/scroll-tracker.js

@@ -6,7 +6,7 @@
   window.GOVUK = window.GOVUK || {}
 
   var CONFIG = {
-    '/transition': [
+    '/brexit': [
       ['Percent', 20],
       ['Percent', 40],
       ['Percent', 60],

data/app/assets/stylesheets/govuk_publishing_components/_all_components.scss

@@ -1,6 +1,9 @@
 // This is the file that the application needs to include in order to use
 // the components.
 
+// feature flag for accessible link styles
+$govuk-new-link-styles: true;
+
 @import "govuk_publishing_components/govuk_frontend_support";
 @import "govuk_publishing_components/component_support";
 

data/app/assets/stylesheets/govuk_publishing_components/components/_accordion.scss

@@ -40,6 +40,7 @@ $gem-c-accordion-bottom-border-width: 1px;
     @include govuk-font($size: 16);
     @include govuk-link-common;
     @include govuk-link-style-default;
+
     // Remove default button focus outline in Firefox
     &::-moz-focus-inner {
       padding: 0;
@@ -47,21 +48,6 @@ $gem-c-accordion-bottom-border-width: 1px;
     }
   }
 
-  .gem-c-accordion__open-all:hover,
-  .gem-c-accordion__open-all-text:hover {
-    text-decoration: underline;
-    color: $govuk-link-colour;
-  }
-
-  // Focus state, also to change chervon icon to black
-  .gem-c-accordion__open-all:focus {
-    .gem-c-accordion__open-all-text,
-    .gem-c-accordion-nav__chevron {
-      color: $govuk-focus-text-colour;
-      text-decoration: none;
-    }
-  }
-
   // Create Chervon icon align with text
   .gem-c-accordion-nav__chevron {
     vertical-align: text-top;
@@ -73,6 +59,7 @@ $gem-c-accordion-bottom-border-width: 1px;
     margin-left: govuk-em(5, 14);
     border: govuk-em(1, 14) solid;
     border-radius: govuk-em(100, 14);
+
     // Main icon size across views, yet keep responsive for zoom
     @include govuk-media-query($from: tablet) {
       width: govuk-em(20, 16);
@@ -94,6 +81,7 @@ $gem-c-accordion-bottom-border-width: 1px;
       transform: rotate(-45deg);
       left: govuk-em(6, 14);
       bottom: govuk-em(5, 14);
+
       @include govuk-media-query($from: tablet) {
         width: govuk-em(6, 16);
         height: govuk-em(6, 16);
@@ -105,6 +93,22 @@ $gem-c-accordion-bottom-border-width: 1px;
     }
   }
 
+  .gem-c-accordion__open-all:hover,
+  .gem-c-accordion__section-button:hover {
+    .gem-c-accordion-nav__chevron {
+      color: $govuk-link-hover-colour;
+      text-decoration: none;
+    }
+  }
+
+  // Focus state, also to change chervon icon to black
+  .gem-c-accordion__open-all:focus {
+    .gem-c-accordion-nav__chevron {
+      color: $govuk-focus-text-colour;
+      text-decoration: none;
+    }
+  }
+
   // Rotate icon to create "Down" version
   .gem-c-accordion-nav__chevron--down {
     transform: rotate(180deg);
@@ -150,6 +154,10 @@ $gem-c-accordion-bottom-border-width: 1px;
     @include govuk-typography-common;
     width: 100%;
 
+    &:hover {
+      color: $govuk-link-hover-colour;
+    }
+
     &:active {
       z-index: 1;
       color: $govuk-link-active-colour;
@@ -163,26 +171,12 @@ $gem-c-accordion-bottom-border-width: 1px;
     }
   }
 
-  .gem-c-accordion__section-button:hover {
-    color: $govuk-link-colour;
-    // On hover, add underline to toggle link
-    .gem-c-accordion__toggle-text {
-      text-decoration: underline;
-      color: $govuk-link-colour;
-    }
-  }
-
   .gem-c-accordion__section-button:focus {
     @include govuk-focused-text;
     // Overwrite focus border to top
     box-shadow: 0 0, 0 -4px;
     border-top: 1px solid transparent;
 
-    // Focus state to change the toggle link within individual sections
-    .gem-c-accordion__toggle-text {
-      color: $govuk-focus-text-colour;
-      text-decoration: none;
-    }
     // Focus state to change chervon icon colour within individual sections
     .gem-c-accordion-nav__chevron {
       color: $govuk-text-colour;
@@ -225,10 +219,24 @@ $gem-c-accordion-bottom-border-width: 1px;
     }
   }
 
-  // Setting width of the text, so the icon doesn't shift (left / right) when toggled
   .gem-c-accordion__toggle-text {
-    min-width: govuk-em(40, 16);
     display: inline-block;
+    // Setting width of the text so the icon doesn't shift left or right when
+    // toggled:
+    min-width: govuk-em(40, 16);
+  }
+
+  // On hover add underline to toggle link only:
+  .gem-c-accordion__section-button:hover .gem-c-accordion__toggle-text {
+    color: $govuk-link-hover-colour;
+    @include govuk-link-decoration;
+    @include govuk-link-hover-decoration;
+  }
+
+  // Ensure the correct focus sstate text colour and no underline:
+  .gem-c-accordion__section-button:focus .gem-c-accordion__toggle-text {
+    color: $govuk-focus-text-colour;
+    text-decoration: none;
   }
 
   .gem-c-accordion__open-all-text {
@@ -237,6 +245,17 @@ $gem-c-accordion-bottom-border-width: 1px;
     text-align: left;
   }
 
+  .gem-c-accordion__open-all:hover {
+    .gem-c-accordion__open-all-text {
+      @include govuk-link-decoration;
+      @include govuk-link-hover-decoration;
+    }
+  }
+
+  .gem-c-accordion__open-all:focus .gem-c-accordion__open-all-text {
+    text-decoration: none;
+  }
+
   // Change the summary subheading size.
   .gem-c-accordion__section-summary {
     @include govuk-responsive-margin(1, "top");

data/app/assets/stylesheets/govuk_publishing_components/components/_action-link.scss

@@ -32,10 +32,6 @@
 .gem-c-action-link__link {
   color: inherit;
 
-  &:hover {
-    text-decoration: underline;
-  }
-
   &:focus {
     text-decoration: none;
     color: $govuk-focus-text-colour;
@@ -106,10 +102,6 @@
     background-size: 25px auto;
     background-position: 0 2px;
   }
-
-  .gem-c-action-link__link {
-    text-decoration: none;
-  }
 }
 
 .gem-c-action-link--simple-light {
@@ -122,10 +114,6 @@
     background-size: 25px auto;
     background-position: 0 2px;
   }
-
-  .gem-c-action-link__link {
-    text-decoration: none;
-  }
 }
 
 .gem-c-action-link--dark-icon {
@@ -150,10 +138,6 @@
     background-size: 25px auto;
     background-position: 0 2px;
   }
-
-  .gem-c-action-link__link {
-    text-decoration: none;
-  }
 }
 
 .gem-c-action-link--transparent-icon {
@@ -177,25 +161,6 @@
 .gem-c-action-link--light-text {
   color: govuk-colour("white");
 
-  .gem-c-action-link__link,
-  .gem-c-action-link__subtext-link {
-    text-decoration: underline;
-
-    &:link,
-    &:visited {
-      color: govuk-colour("white");
-    }
-
-    &:hover {
-      color: $gem-hover-dark-background;
-    }
-
-    &:focus {
-      text-decoration: none;
-      color: $govuk-focus-text-colour;
-    }
-  }
-
   .gem-c-action-link__subtext {
     &:before {
       border-color: govuk-colour("white");

data/app/assets/stylesheets/govuk_publishing_components/components/_contents-list.scss

@@ -25,19 +25,6 @@
   list-style-type: none;
 }
 
-.gem-c-contents-list--no-underline {
-  .gem-c-contents-list__link {
-    text-decoration: none;
-
-    &:hover,
-    &:active {
-      text-decoration: underline;
-    }
-
-    @include govuk-template-link-focus-override;
-  }
-}
-
 .gem-c-contents-list__link {
   .gem-c-contents-list__list-item--parent > & {
     font-weight: bold;

data/app/assets/stylesheets/govuk_publishing_components/components/_image-card.scss

@@ -63,12 +63,6 @@
 }
 
 .gem-c-image-card__title-link {
-  text-decoration: none;
-
-  &:hover {
-    text-decoration: underline;
-  }
-
   &:focus {
     text-decoration: none;
   }

data/app/assets/stylesheets/govuk_publishing_components/components/_inverse-header.scss

@@ -7,10 +7,6 @@
   box-sizing: border-box;
 }
 
-.gem-c-inverse-header a {
-  color: govuk-colour("white");
-}
-
 .gem-c-inverse-header .gem-c-inverse-header__supplement,
 .gem-c-inverse-header .publication-header__last-changed {
   // This publication-header class is injected on publication pages, really

data/app/assets/stylesheets/govuk_publishing_components/components/_organisation-logo.scss

@@ -1,12 +1,14 @@
 // Default logo corresponds with the "medium stacked" Whitehall equivalent
 .gem-c-organisation-logo {
   font-size: 13px;
-  line-height: (15 / 13);
   font-weight: 400;
+  line-height: 1.35;
+  // When this is a heading the margin needs to be set to stop it from
+  // inheriting the browser's default margin:
+  margin: 0;
 
   @include govuk-media-query($from: tablet) {
     font-size: 18px;
-    line-height: 20px;
   }
 }
 
@@ -62,7 +64,12 @@
   font-family: "HelveticaNeue", "Helvetica Neue", "Arial", "Helvetica", sans-serif;
 
   &:hover {
-    text-decoration: underline;
+    color: $govuk-link-hover-colour;
+  }
+
+  &:active {
+    color: govuk-colour("black");
+    @include govuk-link-hover-decoration;
   }
 
   &:focus {

data/app/assets/stylesheets/govuk_publishing_components/components/_previous-and-next-navigation.scss

@@ -31,6 +31,16 @@
   &:hover,
   &:active {
     background-color: govuk-colour("light-grey", $legacy: "grey-4");
+
+    // Add govuk-link hover decoration to title if no label present
+    .gem-c-pagination__link-text--decorated {
+      @include govuk-link-decoration;
+    }
+
+    .gem-c-pagination__link-label,
+    .gem-c-pagination__link-text--decorated {
+      @include govuk-link-hover-decoration;
+    }
   }
 
   &:focus {
@@ -73,8 +83,8 @@
 .gem-c-pagination__link-label {
   display: inline-block;
   margin-top: .1em;
-  text-decoration: underline;
   margin-left: govuk-spacing(5);
+  @include govuk-link-decoration;
 
   @include govuk-media-query($from: tablet) {
     margin-left: govuk-spacing(6);

data/app/assets/stylesheets/govuk_publishing_components/components/_print-link.scss

@@ -20,6 +20,7 @@ $gem-c-print-link-background-height: 18px;
   background: image-url("govuk_publishing_components/icon-print.png") no-repeat govuk-spacing(2) 50%;
   background-size: $gem-c-print-link-background-width $gem-c-print-link-background-height;
   padding: govuk-spacing(2) govuk-spacing(2) govuk-spacing(2) (govuk-spacing(4) + $gem-c-print-link-background-width);
+  text-decoration: none;
 
   @include govuk-device-pixel-ratio($ratio: 2) {
     background-image: image-url("govuk_publishing_components/icon-print-2x.png");
@@ -32,7 +33,6 @@ $gem-c-print-link-background-height: 18px;
 
 .gem-c-print-link__link {
   box-shadow: inset 0 0 0 1px $govuk-border-colour;
-  text-decoration: none;
 
   &:focus {
     border: 0;

data/app/assets/stylesheets/govuk_publishing_components/components/_share-links.scss

@@ -22,7 +22,6 @@ $share-button-height: 32px;
 .gem-c-share-links__link {
   @include govuk-font(16, $weight: bold);
   margin-right: govuk-spacing(6);
-  text-decoration: none;
 
   @include govuk-template-link-focus-override;
 }

data/app/assets/stylesheets/govuk_publishing_components/components/_show-password.scss

@@ -49,6 +49,7 @@
 
   &:hover {
     color: $govuk-link-hover-colour;
+    @include govuk-link-hover-decoration;
   }
 
   &:focus {

data/app/assets/stylesheets/govuk_publishing_components/components/_step-by-step-nav.scss

@@ -116,7 +116,8 @@ $top-border: solid 1px govuk-colour("mid-grey", $legacy: "grey-3");
   padding: 0 0 govuk-spacing(1);
 
   &:hover .gem-c-step-nav__button-text {
-    text-decoration: underline;
+    @include govuk-link-decoration;
+    @include govuk-link-hover-decoration;
   }
 
   .gem-c-step-nav--large & {
@@ -125,6 +126,10 @@ $top-border: solid 1px govuk-colour("mid-grey", $legacy: "grey-3");
 
   &:focus {
     @include step-nav-chevron-focus-state;
+
+    .gem-c-step-nav__button-text {
+      text-decoration: none;
+    }
   }
 }
 
@@ -338,7 +343,8 @@ $top-border: solid 1px govuk-colour("mid-grey", $legacy: "grey-3");
     }
 
     .gem-c-step-nav__button-text {
-      text-decoration: underline;
+      @include govuk-link-decoration;
+      @include govuk-link-hover-decoration;
     }
   }
 }

data/app/assets/stylesheets/govuk_publishing_components/components/_subscription-links.scss

@@ -45,7 +45,6 @@
 
 .gem-c-subscription-links__item {
   display: inline-block;
-  text-decoration: none;
   background-repeat: no-repeat;
   background-position: 0 20%;
 
@@ -55,6 +54,7 @@
 }
 
 .gem-c-subscription-links__item--button {
+  cursor: pointer;
   display: none;
   font-size: inherit;
   font-weight: inherit;
@@ -71,6 +71,10 @@
     color: $govuk-link-colour;
   }
 
+  &:hover {
+    color: $govuk-link-hover-colour;
+  }
+
   &:visited,
   &:active,
   &:focus {
@@ -106,7 +110,7 @@
 }
 
 .gem-c-subscription-links__icon {
-  margin-right: .1em;
+  margin-right: govuk-spacing(1);
   color: govuk-colour("black");
 }