[SPIKE] Functional colours for hover

[NickColley]

No description provided.

[github-actions]

Stylesheets changes to npm package

diff --git a/packages/govuk-frontend/dist/govuk/govuk-frontend.min.css b/packages/govuk-frontend/dist/govuk/govuk-frontend.min.css
index c72cc565e..0d9446343 100644
--- a/packages/govuk-frontend/dist/govuk/govuk-frontend.min.css
+++ b/packages/govuk-frontend/dist/govuk/govuk-frontend.min.css
@@ -1168,8 +1168,8 @@
 
 .govuk-frontend-supported .govuk-accordion__show-all:hover {
     color: #0b0c0c;
-    background: #f3f3f3;
-    box-shadow: 0 -2px #f3f3f3, 0 4px #f3f3f3
+    background: var(--govuk-hover-colour-lighter, #f3f3f3);
+    box-shadow: 0 -2px var(--govuk-hover-colour-lighter, #f3f3f3), 0 4px var(--govuk-hover-colour-lighter, #f3f3f3)
 }
 
 .govuk-frontend-supported .govuk-accordion__show-all:hover .govuk-accordion__section-toggle-text {
@@ -1182,7 +1182,7 @@
 }
 
 .govuk-frontend-supported .govuk-accordion__show-all:hover .govuk-accordion-nav__chevron:after {
-    color: #f3f3f3
+    color: var(--govuk-hover-colour-lighter, #f3f3f3)
 }
 
 .govuk-frontend-supported .govuk-accordion__show-all:focus {
@@ -1268,7 +1268,7 @@
 
 .govuk-frontend-supported .govuk-accordion__section-button:hover {
     color: #0b0c0c;
-    background: #f3f3f3
+    background: var(--govuk-hover-colour-lighter, #f3f3f3)
 }
 
 .govuk-frontend-supported .govuk-accordion__section-button:hover .govuk-accordion__section-toggle-text {
@@ -1281,7 +1281,7 @@
 }
 
 .govuk-frontend-supported .govuk-accordion__section-button:hover .govuk-accordion-nav__chevron:after {
-    color: #f3f3f3
+    color: var(--govuk-hover-colour-lighter, #f3f3f3)
 }
 
 .govuk-frontend-supported .govuk-accordion__section-button:focus {
@@ -1789,7 +1789,7 @@
 }
 
 .govuk-button--secondary:hover {
-    background-color: #cecece
+    background-color: var(--govuk-hover-colour-lighter, #cecece)
 }
 
 .govuk-button--secondary:hover[disabled] {
@@ -1831,7 +1831,7 @@
 }
 
 .govuk-button--inverse:hover {
-    background-color: #f4f8fb
+    background-color: var(--govuk-hover-colour-lighter, #f4f8fb)
 }
 
 .govuk-button--inverse:hover[disabled] {
@@ -3209,7 +3209,7 @@ screen and (forced-colors:active) {
 .govuk-file-upload-button--empty:active,
 .govuk-file-upload-button--empty:focus,
 .govuk-file-upload-button--empty:hover {
-    background-color: #f3f3f3
+    background-color: var(--govuk-hover-colour-lighter, #f3f3f3)
 }
 
 .govuk-file-upload-button--empty:active .govuk-file-upload-button__status,
@@ -3936,7 +3936,7 @@ screen and (forced-colors:active) {
 .govuk-pagination__item:hover,
 .govuk-pagination__next:hover,
 .govuk-pagination__prev:hover {
-    background-color: #f3f3f3
+    background-color: var(--govuk-hover-colour-lighter, #f3f3f3)
 }
 
 .govuk-pagination__item {
@@ -5718,7 +5718,7 @@ screen and (-ms-high-contrast:active) {
 }
 
 .govuk-task-list__item--with-link:hover {
-    background: #f3f3f3
+    background: var(--govuk-hover-colour-lighter, #f3f3f3)
 }
 
 .govuk-task-list__name-and-hint,

---

Action run for 33a82bf

[github-actions]

Other changes to npm package

diff --git a/packages/govuk-frontend/dist/govuk/components/accordion/_mixin.scss b/packages/govuk-frontend/dist/govuk/components/accordion/_mixin.scss
index 799037806..6ef11a8a6 100644
--- a/packages/govuk-frontend/dist/govuk/components/accordion/_mixin.scss
+++ b/packages/govuk-frontend/dist/govuk/components/accordion/_mixin.scss
@@ -3,7 +3,7 @@
 /// @access private
 @mixin styles {
   $govuk-accordion-base-colour: base.govuk-colour("black");
-  $govuk-accordion-hover-colour: base.govuk-colour("black", $variant: "tint-95");
+  $govuk-accordion-hover-colour: var(--govuk-hover-colour-lighter, base.govuk-colour("black", $variant: "tint-95"));
   $govuk-accordion-icon-focus-colour: base.govuk-functional-colour(focus);
   $govuk-accordion-bottom-border-width: 1px;
 
diff --git a/packages/govuk-frontend/dist/govuk/components/button/_mixin.scss b/packages/govuk-frontend/dist/govuk/components/button/_mixin.scss
index c992115b7..2cf037596 100644
--- a/packages/govuk-frontend/dist/govuk/components/button/_mixin.scss
+++ b/packages/govuk-frontend/dist/govuk/components/button/_mixin.scss
@@ -14,7 +14,10 @@
   // Secondary button variables
   $govuk-secondary-button-colour: base.govuk-colour("black", $variant: "tint-95");
   $govuk-secondary-button-text-colour: base.govuk-colour("black");
-  $govuk-secondary-button-hover-colour: base.govuk-colour("black", $variant: "tint-80");
+  $govuk-secondary-button-hover-colour: var(
+    --govuk-hover-colour-lighter,
+    base.govuk-colour("black", $variant: "tint-80")
+  );
   $govuk-secondary-button-shadow-colour: base.govuk-colour("black", $variant: "tint-50");
 
   // Warning button variables
@@ -26,7 +29,7 @@
   // Inverse button variables
   $govuk-inverse-button-colour: $inverse-background-colour;
   $inverse-text-colour: $inverse-text-colour;
-  $govuk-inverse-button-hover-colour: base.govuk-colour("blue", $variant: "tint-95");
+  $govuk-inverse-button-hover-colour: var(--govuk-hover-colour-lighter, base.govuk-colour("blue", $variant: "tint-95"));
   $govuk-inverse-button-shadow-colour: base.govuk-colour("blue", $variant: "shade-50");
 
   // Because the shadow (s0) is visually 'part of' the button, we need to reduce
diff --git a/packages/govuk-frontend/dist/govuk/components/file-upload/_mixin.scss b/packages/govuk-frontend/dist/govuk/components/file-upload/_mixin.scss
index 47a215bef..b2798672f 100644
--- a/packages/govuk-frontend/dist/govuk/components/file-upload/_mixin.scss
+++ b/packages/govuk-frontend/dist/govuk/components/file-upload/_mixin.scss
@@ -180,7 +180,7 @@
     &:hover,
     &:focus,
     &:active {
-      background-color: base.govuk-colour("black", $variant: "tint-95");
+      background-color: var(--govuk-hover-colour-lighter, base.govuk-colour("black", $variant: "tint-95"));
 
       .govuk-file-upload-button__status {
         background-color: base.govuk-colour("blue", $variant: "tint-80");
diff --git a/packages/govuk-frontend/dist/govuk/components/pagination/_mixin.scss b/packages/govuk-frontend/dist/govuk/components/pagination/_mixin.scss
index 6d7017261..05b4129a6 100644
--- a/packages/govuk-frontend/dist/govuk/components/pagination/_mixin.scss
+++ b/packages/govuk-frontend/dist/govuk/components/pagination/_mixin.scss
@@ -35,7 +35,7 @@
     float: left; // Float is ignored if flex is active for prev/next links
 
     &:hover {
-      background-color: base.govuk-colour("black", $variant: "tint-95");
+      background-color: var(--govuk-hover-colour-lighter, base.govuk-colour("black", $variant: "tint-95"));
     }
   }
 
diff --git a/packages/govuk-frontend/dist/govuk/components/task-list/_mixin.scss b/packages/govuk-frontend/dist/govuk/components/task-list/_mixin.scss
index db47f1e25..bca899bd1 100644
--- a/packages/govuk-frontend/dist/govuk/components/task-list/_mixin.scss
+++ b/packages/govuk-frontend/dist/govuk/components/task-list/_mixin.scss
@@ -2,7 +2,7 @@
 
 /// @access private
 @mixin styles {
-  $govuk-task-list-hover-colour: base.govuk-colour("black", $variant: "tint-95");
+  $govuk-task-list-hover-colour: var(--govuk-hover-colour-lighter, base.govuk-colour("black", $variant: "tint-95"));
 
   .govuk-task-list {
     @include base.govuk-font($size: 19);

---

Action run for 33a82bf

[github-actions]

📋 Stats

File sizes

File	Size	Percentage change
dist/govuk-frontend-development.min.css	120.23 KiB	0.3%
packages/govuk-frontend/dist/govuk/govuk-frontend.min.css	120.22 KiB	0.3%

No changes to module sizes.

---

Action run for 33a82bf