govuk_publishing_components 27.10.5 → 27.11.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 7cf2ebcbfd20fc146d07f7edcacf06c2c0dec708408c27217ff04e9475bbedc1
-  data.tar.gz: b03ddc5f4e26590d295a75aaca6f97f18659e3ceeec6a7714d9fe093ea617eb9
+  metadata.gz: 4cdfb123c38b321591389c84e2e9b397c5667f9782bc657efaaa59468d535f6a
+  data.tar.gz: 8d71ce616148c775034f93537252b16b40b134918ed34ff46bfb971963f93ca4
 SHA512:
-  metadata.gz: 94559c60b8dd1124dd1096ec430a87f6c601efcb6a9f02af1ba85f705d1dd22971d2626f1b46627152a2c4e75b832c9a88ca664eac84a3534297688ab9ff2469
-  data.tar.gz: 534dc11dadc43079d31f952ce41a51615209367cbd48850f1f02b7f1af12402d06aca99c586fcdeb5464645cc226a8713f13b850eb9409677ac931b733cb60fc
+  metadata.gz: 16d792dd3e4cdf1350cf32bd1b5090e7dfe097ae3bbad51637b820745fb84d0ddb9ef9b0aa697c100f721ff9845c519cd335b1c459a10ba392c883eaaaca7cb0
+  data.tar.gz: 02a880a029f8991916315ed45ca24e87bdc59db3c426966b005f8ab043f21fbcb9a7c00fcc9686a4e12a6fe6502168f4d022fdc0c32f5cbebcc1a2e5c54d7e71

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

@@ -68,6 +68,7 @@ $govuk-new-link-styles: true;
 @import "components/select";
 @import "components/share-links";
 @import "components/show-password";
+@import "components/single-page-notification-button";
 @import "components/skip-link";
 @import "components/step-by-step-nav-header";
 @import "components/step-by-step-nav-related";

data/app/assets/stylesheets/govuk_publishing_components/components/_layout-super-navigation-header.scss

@@ -46,6 +46,10 @@
   grid-template-columns: fractions($columns);
   -ms-grid-rows: fractions($rows);
   grid-template-rows: fractions($rows);
+}
+
+@mixin columns-children($items, $columns, $selector: "*") {
+  $rows: ceil($items / $columns);
 
   // Internet Explorer 10-11 require each element to be placed in the grid -
   // the `grid-auto-flow` property isn't supported. This means that both the
@@ -556,38 +560,39 @@ $chevron-indent-spacing: 7px;
 
 // Styles for top level navigation toggle button.
 .gem-c-layout-super-navigation-header__navigation-top-toggle-button {
-  @include govuk-font($size: 19, $weight: "bold", $line-height: 20px);
+  @include govuk-link-common;
+  @include govuk-link-style-no-visited-state;
+  @include govuk-link-style-no-underline;
+
+  font-size: 16px;
+  @if $govuk-typography-use-rem {
+    font-size: govuk-px-to-rem(16px);
+  }
+  font-weight: 700;
   background: govuk-colour("black");
   border: 0;
-  border-left: 1px solid govuk-colour("white");
-  border-right: 1px solid govuk-colour("white");
   box-sizing: border-box;
   color: govuk-colour("white");
   cursor: pointer;
   height: govuk-spacing(9);
-  margin-right: -1px;
-  padding: govuk-spacing(4);
+  padding: 0;
   position: absolute;
-  right: (govuk-spacing(9) - govuk-spacing(3));
+  right: ((govuk-spacing(9) - govuk-spacing(3)) - 1px); // width of the search button (60px) - 15px - 1px to create an overlap between buttons and stop the border appearing to hang off the buttons when they're focused/open
   top: 0;
-
-  @include govuk-media-query($from: 360px) {
-    right: govuk-spacing(9);
-
-    &:before {
-      @include chevron(govuk-colour("white"));
-    }
-  }
+  z-index: 10;
 
   @include focus-and-focus-visible {
     @include govuk-focused-text;
-    border-color: $govuk-focus-colour;
     box-shadow: none;
-    z-index: 10;
 
-    @include govuk-media-query($from: 360px) {
-      &:before {
-        @include chevron(govuk-colour("black"), true);
+    .gem-c-layout-super-navigation-header__navigation-top-toggle-button-inner {
+      border-color: $govuk-focus-colour;
+      color: govuk-colour("black");
+
+      @include govuk-media-query($from: 360px) {
+        &:before {
+          @include chevron(govuk-colour("black"), true);
+        }
       }
     }
   }
@@ -596,42 +601,70 @@ $chevron-indent-spacing: 7px;
   // See https://www.tpgi.com/focus-visible-and-backwards-compatibility/
   @include focus-not-focus-visible {
     background: none;
-    border-color: govuk-colour("white");
     box-shadow: none;
-    color: govuk-colour("white");
 
-    @include govuk-media-query($from: 360px) {
-      &:before {
-        @include chevron(govuk-colour("white"), true);
+    .gem-c-layout-super-navigation-header__navigation-top-toggle-button-inner {
+      border-color: govuk-colour("white");
+      color: govuk-colour("white");
+
+      @include govuk-media-query($from: 360px) {
+        &:before {
+          @include chevron(govuk-colour("white"), true);
+        }
       }
     }
   }
 
   // Open button modifier
   &.gem-c-layout-super-navigation-header__open-button {
+    // stylelint-disable max-nesting-depth
     @include focus-and-focus-visible {
       @include govuk-focused-text;
-      border-color: $govuk-focus-colour;
       box-shadow: none;
-      color: $govuk-focus-colour;
 
-      @include govuk-media-query($from: 360px) {
-        &:before {
-          @include chevron($govuk-focus-colour, true);
+      .gem-c-layout-super-navigation-header__navigation-top-toggle-button-inner {
+        color: govuk-colour("black");
+        border-color: $govuk-focus-colour;
+
+        @include govuk-media-query($from: 360px) {
+          &:before {
+            @include chevron(govuk-colour("black"), true);
+            transform: translateY(0) rotate(225deg);
+          }
         }
       }
     }
 
     @include focus-not-focus-visible {
       background: govuk-colour("light-grey");
-      color: govuk-colour("light-grey");
 
-      @include govuk-media-query($from: 360px) {
-        &:before {
-          @include chevron(govuk-colour("light-grey"));
+      .gem-c-layout-super-navigation-header__navigation-top-toggle-button-inner {
+        color: govuk-colour("black");
+        border-color: govuk-colour("light-grey");
+
+        @include govuk-media-query($from: 360px) {
+          &:before {
+            @include chevron(govuk-colour("black"));
+            transform: translateY(0) rotate(225deg);
+          }
         }
       }
     }
+    // stylelint-enable max-nesting-depth
+  }
+}
+
+.gem-c-layout-super-navigation-header__navigation-top-toggle-button-inner {
+  display: inline-block;
+  border-left: 1px solid govuk-colour("white");
+  border-right: 1px solid govuk-colour("white");
+  margin: govuk-spacing(2) 0;
+  padding: govuk-spacing(2) govuk-spacing(4);
+
+  @include govuk-media-query($from: 360px) {
+    &:before {
+      @include chevron(govuk-colour("white"));
+    }
   }
 }
 
@@ -640,7 +673,6 @@ $chevron-indent-spacing: 7px;
   @include govuk-font($size: 19, $weight: "bold", $line-height: 20px);
   background: govuk-colour("black");
   border: 0;
-  border-left: 1px solid govuk-colour("white");
   color: govuk-colour("white");
   cursor: pointer;
   height: govuk-spacing(9);
@@ -654,6 +686,7 @@ $chevron-indent-spacing: 7px;
     @include govuk-focused-text;
     border-color: $govuk-focus-colour;
     box-shadow: none;
+    z-index: 11;
   }
 
   &:focus:not(:focus-visible) {
@@ -663,14 +696,12 @@ $chevron-indent-spacing: 7px;
     color: govuk-colour("white");
   }
 
-  @include govuk-media-query($from: 360px) {
+  @include govuk-media-query($from: "desktop") {
     right: 0;
-  }
 
-  @include govuk-media-query($from: "desktop") {
     @include focus-not-focus-visible {
       background: $govuk-brand-colour;
-      border-bottom: 1px solid govuk-colour("black");
+      border-bottom: 1px solid govuk-colour("dark-blue");
       border-left: none;
       position: relative;
     }
@@ -776,9 +807,7 @@ $chevron-indent-spacing: 7px;
 
     & > li {
       box-sizing: border-box;
-      margin-bottom: 0;
-      padding-left: govuk-spacing(3);
-      padding-right: govuk-spacing(3);
+      margin: 0 govuk-spacing(3) govuk-spacing(2) govuk-spacing(3);
     }
   }
 }
@@ -786,13 +815,62 @@ $chevron-indent-spacing: 7px;
 .gem-c-layout-super-navigation-header__navigation-second-items--topics {
   @include govuk-media-query($from: "desktop") {
     @include columns(18, 2, "li");
+    @include columns-children(18, 2, "li");
   }
 }
 
 .gem-c-layout-super-navigation-header__navigation-second-items--government-activity {
+  & > li:first-child {
+    margin-bottom: govuk-spacing(7);
+  }
+
   @include govuk-media-query($from: "desktop") {
-    @include columns(5, 2, "li");
-    padding-bottom: govuk-spacing(3);
+    @include columns(7, 2, "li");
+    padding-bottom: 0;
+
+    & > li,
+    & > li:first-child {
+      margin-bottom: govuk-spacing(4);
+    }
+
+    @supports (display: grid) {
+      & > li:first-child {
+        grid-column: span 2;
+      }
+    }
+
+    & > li:first-child {
+      border-bottom: 1px solid $govuk-border-colour;
+      padding-bottom: 0;
+      -ms-grid-column-span: 2;
+      -ms-grid-column: 1;
+      -ms-grid-row: 1;
+    }
+
+    & > li:nth-child(2) {
+      -ms-grid-column: 1;
+      -ms-grid-row: 2;
+    }
+
+    & > li:nth-child(3) {
+      -ms-grid-column: 1;
+      -ms-grid-row: 3;
+    }
+
+    & > li:nth-child(4) {
+      -ms-grid-column: 1;
+      -ms-grid-row: 4;
+    }
+
+    & > li:nth-child(5) {
+      -ms-grid-column: 2;
+      -ms-grid-row: 2;
+    }
+
+    & > li:nth-child(6) {
+      -ms-grid-column: 2;
+      -ms-grid-row: 3;
+    }
   }
 }
 
@@ -804,6 +882,10 @@ $chevron-indent-spacing: 7px;
   @include govuk-media-query($from: "desktop") {
     font-weight: bold;
     padding: 0;
+
+    &:after {
+      content: none;
+    }
   }
 }
 
@@ -814,19 +896,21 @@ $chevron-indent-spacing: 7px;
 }
 
 // Dropdown menu footer links.
-.gem-c-layout-super-navigation-header__navigation-second-footer {
-  border-top: 1px solid govuk-colour("mid-grey");
+.gem-c-layout-super-navigation-header__navigation-second-footer-break {
+  @include govuk-media-query($until: "desktop") {
+    display: none;
+  }
 }
 
 .gem-c-layout-super-navigation-header__navigation-second-footer-list {
   list-style: none;
-  padding-bottom: govuk-spacing(8);
-  padding-top: govuk-spacing(4);
-
-  @include govuk-grid-column($width: "two-thirds", $float: right, $at: "desktop");
+  padding: 0 0 govuk-spacing(8) 0;
 
   @include govuk-media-query($from: "desktop") {
-    padding: govuk-spacing(7) 0 govuk-spacing(8) 0;
+    margin: 0 (0 - govuk-spacing(3)) 0 (0 - govuk-spacing(3));
+    padding: govuk-spacing(8) 0 govuk-spacing(9) 0;
+    @include columns(2, 2, "li");
+    @include columns-children(2, 2, "li");
   }
 }
 
@@ -835,15 +919,12 @@ $chevron-indent-spacing: 7px;
   position: relative;
 
   @include govuk-media-query($from: "desktop") {
-    box-sizing: border-box;
-    float: left;
-    padding: 0 govuk-spacing(3);
-    width: 50%;
+    padding: 0 govuk-spacing(3) 0 govuk-spacing(3);
   }
 }
 
 .gem-c-layout-super-navigation-header__navigation-second-footer-link {
-  @include govuk-font($size: 19, $weight: bold);
+  @include govuk-font($size: 19, $weight: normal);
   display: inline-block;
   margin: govuk-spacing(1) 0;
 

data/app/assets/stylesheets/govuk_publishing_components/components/_single-page-notification-button.scss

@@ -0,0 +1,30 @@
+.gem-c-single-page-notification-button__submit {
+  padding: govuk-spacing(2);
+  margin: govuk-spacing(0);
+  border: 1px solid $govuk-border-colour;
+  color: $govuk-link-colour;
+  cursor: pointer;
+  background: none;
+
+  &:focus {
+    @include govuk-focused-text;
+    background-color: $govuk-focus-colour;
+    border-color: transparent;
+    box-shadow: 0 $govuk-focus-width $govuk-text-colour;
+  }
+
+  &:hover {
+    background-color: govuk-colour("light-grey");
+    color: $govuk-link-hover-colour;
+
+    &:focus {
+      color: $govuk-text-colour;
+    }
+  }
+}
+
+.gem-c-single-page-notification-button__icon {
+  color: govuk-colour("black");
+  vertical-align: top;
+  margin-right: govuk-spacing(1);
+}

data/app/models/govuk_publishing_components/shared_accessibility_criteria.rb

@@ -4,6 +4,23 @@ module GovukPublishingComponents
       "
 Links in the component must:
 
+- accept focus
+- be focusable with a keyboard
+- be usable with a keyboard
+- indicate when they have focus
+- change in appearance when touched (in the touch-down state)
+- change in appearance when hovered
+- be usable with touch
+- be usable with [voice commands](https://www.w3.org/WAI/perspectives/voice.html)
+- have visible text
+- have meaningful text
+      "
+    end
+
+    def self.button
+      "
+Buttons in the component must:
+
 - accept focus
 - be focusable with a keyboard
 - be usable with a keyboard

data/app/views/govuk_publishing_components/components/_layout_super_navigation_header.html.erb

@@ -80,13 +80,8 @@
         id="super-navigation-menu-toggle"
         type="button"
       >
-        Menu
-        <span
-          aria-hidden="true"
-          class="gem-c-layout-super-navigation-header__navigation-top-toggle-close-icon"
-          focusable="false"
-        >
-          &times;
+        <span class="gem-c-layout-super-navigation-header__navigation-top-toggle-button-inner">
+          Menu
         </span>
       </button>
       <ul id="super-navigation-menu" class="gem-c-layout-super-navigation-header__navigation-items">
@@ -147,8 +142,8 @@
                         </p>
                       <% end %>
                     </div>
-                    <% if link[:menu_contents].present? %>
-                      <div class="govuk-grid-column-two-thirds-from-desktop">
+                    <div class="govuk-grid-column-two-thirds-from-desktop">
+                      <% if link[:menu_contents].present? %>
                           <ul class="govuk-list gem-c-layout-super-navigation-header__navigation-second-items gem-c-layout-super-navigation-header__navigation-second-items--<%= link[:label].parameterize %>">
                             <% link[:menu_contents].each do | item | %>
                               <%
@@ -172,39 +167,32 @@
                               </li>
                             <% end %>
                           </ul>
-                      </div>
-                    <% end %>
-                  </div>
-                  <% if link[:footer_links].present? %>
-                    <div class="govuk-grid-row">
-                      <div class="govuk-grid-column-full">
-                        <div class="gem-c-layout-super-navigation-header__navigation-second-footer">
-                          <div class="govuk-grid-row">
-                            <ul class="gem-c-layout-super-navigation-header__navigation-second-footer-list">
-                              <% link[:footer_links].each do | item | %>
-                                <li class="gem-c-layout-super-navigation-header__navigation-second-footer-item">
-                                  <%= link_to item[:label], item[:href], {
-                                    class: [
-                                      "govuk-link",
-                                      "gem-c-layout-super-navigation-header__navigation-second-footer-link",
-                                    ],
-                                    data: {
-                                      module: "gem-track-click",
-                                      track_action: "#{tracking_label}Link",
-                                      track_category: "headerClicked",
-                                      track_label: item[:href],
-                                      track_dimension: item[:label],
-                                      track_dimension_index: "29",
-                                    }
-                                  } %>
-                                </li>
-                              <% end %>
-                            </ul>
-                          </div>
-                        </div>
-                      </div>
+                      <% end %>
+                      <% if link[:footer_links].present? %>
+                        <hr class="gem-c-layout-super-navigation-header__navigation-second-footer-break govuk-section-break govuk-section-break--visible">
+                        <ul class="gem-c-layout-super-navigation-header__navigation-second-footer-list">
+                          <% link[:footer_links].each do | item | %>
+                            <li class="gem-c-layout-super-navigation-header__navigation-second-footer-item">
+                              <%= link_to item[:label], item[:href], {
+                                class: [
+                                  "govuk-link",
+                                  "gem-c-layout-super-navigation-header__navigation-second-footer-link",
+                                ],
+                                data: {
+                                  module: "gem-track-click",
+                                  track_action: "#{tracking_label}Link",
+                                  track_category: "headerClicked",
+                                  track_label: item[:href],
+                                  track_dimension: item[:label],
+                                  track_dimension_index: "29",
+                                }
+                              } %>
+                            </li>
+                          <% end %>
+                        </ul>
+                      <% end %>
                     </div>
-                  <% end %>
+                  </div>
                 </div>
               </div>
             <% end %>

data/app/views/govuk_publishing_components/components/_single_page_notification_button.html.erb

@@ -0,0 +1,23 @@
+<%
+  page ||= ''
+  data_attributes ||= {}
+  base_path ||= nil
+  local_assigns[:margin_bottom] ||= 3
+  already_subscribed ||= false
+  text ||= already_subscribed ? t('components.single_page_notification_button.unsubscribe_text') : t('components.single_page_notification_button.subscribe_text')
+
+  shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
+  wrapper_classes = %w(gem-c-single-page-notification-button govuk-!-display-none-print)
+  wrapper_classes << shared_helper.get_margin_bottom
+  classes = "govuk-body-s gem-c-single-page-notification-button__submit"
+%>
+<% button_text = capture do %>
+  <svg class="gem-c-single-page-notification-button__icon" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 459.334 459.334"><path fill="currentColor" d="M177.216 404.514c-.001.12-.009.239-.009.359 0 30.078 24.383 54.461 54.461 54.461s54.461-24.383 54.461-54.461c0-.12-.008-.239-.009-.359H175.216zM403.549 336.438l-49.015-72.002v-89.83c0-60.581-43.144-111.079-100.381-122.459V24.485C254.152 10.963 243.19 0 229.667 0s-24.485 10.963-24.485 24.485v27.663c-57.237 11.381-100.381 61.879-100.381 122.459v89.83l-49.015 72.002a24.76 24.76 0 0 0 20.468 38.693H383.08a24.761 24.761 0 0 0 20.469-38.694z"/></svg><%= text %>
+<% end %>
+<%= tag.form class: wrapper_classes, action: "/email/subscriptions/single-page/new", method: "POST", data: data_attributes do %>
+  <input type="hidden" name="base_path" value="<%= base_path %>">
+  <%= content_tag(:button, button_text, {
+    class: classes,
+    type: "submit",
+  }) %>
+<% end if base_path.presence %>

data/app/views/govuk_publishing_components/components/docs/single_page_notification_button.yml

@@ -0,0 +1,32 @@
+name: Single page notification button
+description: A button that subscribes the user to email notifications to a page
+body: |
+  By default, the component displays with the "Get emails about this page" state. The component does not render without the `base_path` parameter.
+
+  The `base_path` is necessary for [checking if an email subscription is active on page load](https://github.com/alphagov/account-api/blob/main/docs/api.md#get-apipersonalisationcheck-email-subscriptiontopic_slug) and the creation/deletion of an email notification subscription.
+
+  When the button is clicked, the `base_path` is submitted to an endpoint which proceeds to check the user's authentication status and whether they are already subscribed to the page or not. Depending on these factors, they will be routed accordingly.
+accessibility_criteria: |
+  - The bell icon must be presentational and ignored by screen readers.
+examples:
+  default:
+    description: By default this component prompts the user to subscribe to email notifications to this page.
+    data:
+      base_path: '/current-page-path'
+  already_subscribed:
+    description: If the user has already subscribed to email notifications about the current page, display the "Stop getting emails about this page" state.
+    data:
+      base_path: '/current-page-path'
+      already_subscribed: true
+  with_data_attributes:
+    description: The component accepts data attributes (for example, for analytics)
+    data:
+      base_path: '/current-page-path'
+      data_attributes:
+        category: fancyButtons
+  with_margin_bottom:
+    description: |
+      The component accepts a number for margin bottom from 0 to 9 (0px to 60px) using the [GOV.UK Frontend spacing scale](https://design-system.service.gov.uk/styles/spacing/#the-responsive-spacing-scale). It defaults to having a margin bottom of 15px.
+    data:
+      base_path: '/current-page-path'
+      margin_bottom: 5

data/app/views/govuk_publishing_components/components/search/_search_icon.html.erb

@@ -13,15 +13,15 @@
   focusable="false"
 >
   <circle
-    cx="10.0161"
-    cy="10.0161"
+    cx="12.0161"
+    cy="11.0161"
     r="8.51613"
     stroke="currentColor"
     stroke-width="3" />
   <line
-    x1="15.8668"
-    y1="16.3587"
-    x2="25.4475"
+    x1="17.8668"
+    y1="17.3587"
+    x2="26.4475"
     y2="25.9393"
     stroke="currentColor"
     stroke-width="3" />

data/config/locales/en.yml

@@ -157,13 +157,14 @@ en:
           href: "/browse/visas-immigration"
         - label: Working, jobs and pensions
           href: "/browse/working"
-      - label: Departments
-        href: "/government/organisations"
       - label: Government activity
         href: "/search/news-and-communications"
-        description: Find out what the government is doing
+        description: Search for a department and find out what the government is doing
         menu_contents: # If adding or removing items, remember to update the
                        # `columns` in the layout-super-navigation-header SCSS.
+        - label: Departments
+          href: "/government/organisations"
+          description: Departments, agencies and public bodies
         - label: News
           href: "/search/news-and-communications"
           description: News stories, speeches, letters and notices
@@ -257,6 +258,9 @@ en:
       hide_password: Hide password
       show: Show
       show_password: Show password
+    single_page_notification_button:
+      subscribe_text: Get emails about this page
+      unsubscribe_text: Stop getting emails about this page
     skip_link:
       text: Skip to main content
     step_by_step_nav:

data/lib/govuk_publishing_components/version.rb

@@ -1,3 +1,3 @@
 module GovukPublishingComponents
-  VERSION = "27.10.5".freeze
+  VERSION = "27.11.0".freeze
 end

data/node_modules/govuk-frontend/govuk/components/accordion/macro-options.json

@@ -3,13 +3,13 @@
         "name": "id",
         "type": "string",
         "required": true,
-        "description": "Must be **unique** across the domain of your service (as the expanded state of individual instances of the component persists across page loads using [`sessionStorage`](https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage)). Used as an `id` in the HTML for the accordion as a whole, and also as a prefix for the `id`s of the section contents and the buttons that open them, so that those `id`s can be the target of `aria-labelledby` and `aria-control` attributes."
+        "description": "Must be unique across the domain of your service (as the expanded state of individual instances of the component persists across page loads using [`sessionStorage`](https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage)). Used as an `id` in the HTML for the accordion as a whole, and also as a prefix for the `id`s of the section contents and the buttons that open them, so that those `id`s can be the target of `aria-labelledby` and `aria-control` attributes."
     },
     {
         "name": "headingLevel",
         "type": "integer",
         "required": false,
-        "description": "Heading level, from 1 to 6. Default is `2`."
+        "description": "Heading level, from `1` to `6`. Default is `2`."
     },
     {
         "name": "classes",

data/node_modules/govuk-frontend/govuk/components/back-link/macro-options.json

@@ -3,19 +3,19 @@
         "name": "text",
         "type": "string",
         "required": false,
-        "description": "Text to use within the back link component. If `html` is provided, the `text` argument will be ignored. Defaults to \"Back\"."
+        "description": "Text to use within the back link component. If `html` is provided, the `text` argument will be ignored. Defaults to 'Back'."
     },
     {
         "name": "html",
         "type": "string",
         "required": false,
-        "description": "HTML to use within the back link component. If `html` is provided, the `text` argument will be ignored. Defaults to \"Back\"."
+        "description": "HTML to use within the back link component. If `html` is provided, the `text` argument will be ignored. Defaults to 'Back'."
     },
     {
         "name": "href",
         "type": "string",
         "required": true,
-        "description": "The value of the link href attribute."
+        "description": "The value of the link's `href` attribute."
     },
     {
         "name": "classes",

data/node_modules/govuk-frontend/govuk/components/button/_index.scss

@@ -158,10 +158,6 @@
       cursor: default;
     }
 
-    &:focus {
-      outline: none;
-    }
-
     &:active {
       top: 0;
       box-shadow: 0 $button-shadow-size 0 $govuk-button-shadow-colour; // s0
@@ -270,6 +266,9 @@
     -webkit-align-self: center;
         -ms-flex-item-align: center;
             align-self: center;
+    // Work around SVGs not inheriting color from parent in forced color mode
+    // (https://github.com/w3c/csswg-drafts/issues/6310)
+    forced-color-adjust: auto;
   }
 
   @if $govuk-use-legacy-font {