From 2a3654d5d64a59f1307f1c778ff0b9c0d336d72a Mon Sep 17 00:00:00 2001
From: Paul Robert Lloyd <me+git@paulrobertlloyd.com>
Date: Wed, 9 Oct 2024 23:43:38 +0100
Subject: [PATCH 1/5] Use single path for NHS logo in header

---
 .../components/header/_header-service.scss    |  7 ----
 packages/components/header/_header-white.scss | 14 +++----
 packages/components/header/_header.scss       | 37 +++++--------------
 packages/components/header/template.njk       | 17 ++++-----
 4 files changed, 24 insertions(+), 51 deletions(-)

diff --git a/packages/components/header/_header-service.scss b/packages/components/header/_header-service.scss
index a14e4556e..5b2595ca9 100644
--- a/packages/components/header/_header-service.scss
+++ b/packages/components/header/_header-service.scss
@@ -16,13 +16,6 @@
     width: auto;
   }
 
-  &:hover {
-    background: none;
-
-    .nhsuk-header__service-name {
-      text-decoration: underline;
-    }
-  }
 
   &:focus {
     background: $nhsuk-focus-color;
diff --git a/packages/components/header/_header-white.scss b/packages/components/header/_header-white.scss
index a59a610c4..d8f9d9159 100644
--- a/packages/components/header/_header-white.scss
+++ b/packages/components/header/_header-white.scss
@@ -20,13 +20,7 @@
   }
 
   .nhsuk-logo {
-    .nhsuk-logo__background {
-      fill: $color_nhsuk-blue;
-    }
-
-    .nhsuk-logo__text {
-      fill: $color_nhsuk-white;
-    }
+    color: $color_nhsuk-blue;
   }
 
   .nhsuk-header__link {
@@ -38,6 +32,12 @@
         color: $nhsuk-text-color;
       }
     }
+
+    &:focus {
+      .nhsuk-logo {
+        color: $nhsuk-text-color;
+      }
+    }
   }
 
   .nhsuk-search__submit {
diff --git a/packages/components/header/_header.scss b/packages/components/header/_header.scss
index 36d0e7a55..f6b052f29 100644
--- a/packages/components/header/_header.scss
+++ b/packages/components/header/_header.scss
@@ -43,31 +43,6 @@
     z-index: 1;
   }
 
-  .nhsuk-logo__background {
-    fill: $color_nhsuk-white;
-
-    @include mq($media-type: print) {
-      fill: $color_nhsuk-blue;
-    }
-  }
-
-  .nhsuk-logo__text {
-    fill: $color_nhsuk-blue;
-
-    @include mq($media-type: print) {
-      fill: $color_nhsuk-white;
-    }
-  }
-
-  @include mq($from: tablet) {
-    padding-left: 0;
-  }
-
-  .nhsuk-logo {
-    @include nhsuk-logo-size;
-    border: 0;
-  }
-
   @include mq($until: desktop) {
     max-width: 60%;
   }
@@ -79,18 +54,24 @@
 
 .nhsuk-header__link {
   @include nhsuk-logo-size;
+  @include nhsuk-link-style-white;
   display: block;
 
   &:hover {
+    text-decoration: underline;
+
     .nhsuk-logo {
-      box-shadow: 0 0 0 $nhsuk-focus-width $color_shade_nhsuk-blue-35;
+      box-shadow: 0 $nhsuk-focus-width $color_shade_nhsuk-blue-35;
     }
   }
 
-  &:focus {
-    box-shadow: none;
+  &:active {
+    color: $color_nhsuk-white;
+  }
 
+  &:focus {
     .nhsuk-logo {
+      background-color: $nhsuk-focus-color;
       box-shadow:
         0 0 0 $nhsuk-focus-width $nhsuk-focus-color,
         0 $nhsuk-focus-width 0 $nhsuk-focus-width $nhsuk-focus-text-color;
diff --git a/packages/components/header/template.njk b/packages/components/header/template.njk
index 5419e7627..73fa2d29e 100644
--- a/packages/components/header/template.njk
+++ b/packages/components/header/template.njk
@@ -5,9 +5,8 @@
 {% set showSearch = params.showSearch if params.showSearch else "false" %}
 
 {% set nhsLogo %}
-  <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100">
-    <path class="nhsuk-logo__background" fill="#005eb8" d="M0 0h40v16H0z"></path>
-    <path class="nhsuk-logo__text" fill="#fff" d="M3.9 1.5h4.4l2.6 9h.1l1.8-9h3.3l-2.8 13H9l-2.7-9h-.1l-1.8 9H1.1M17.3 1.5h3.6l-1 4.9h4L25 1.5h3.5l-2.7 13h-3.5l1.1-5.6h-4.1l-1.2 5.6h-3.4M37.7 4.4c-.7-.3-1.6-.6-2.9-.6-1.4 0-2.5.2-2.5 1.3 0 1.8 5.1 1.2 5.1 5.1 0 3.6-3.3 4.5-6.4 4.5-1.3 0-2.9-.3-4-.7l.8-2.7c.7.4 2.1.7 3.2.7s2.8-.2 2.8-1.5c0-2.1-5.1-1.3-5.1-5 0-3.4 2.9-4.4 5.8-4.4 1.6 0 3.1.2 4 .6"></path>
+  <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 80" height="40" width="100">
+    <path fill="currentcolor" d="M200 0v80H0V0h200Zm-27.5 5.5c-14.5 0-29 5-29 22 0 10.2 7.7 13.5 14.7 16.3l.7.3c5.4 2 10.1 3.9 10.1 8.4 0 6.5-8.5 7.5-14 7.5s-12.5-1.5-16-3.5L135 70c5.5 2 13.5 3.5 20 3.5 15.5 0 32-4.5 32-22.5 0-19.5-25.5-16.5-25.5-25.5 0-5.5 5.5-6.5 12.5-6.5a35 35 0 0 1 14.5 3l4-13.5c-4.5-2-12-3-20-3Zm-131 2h-22l-14 65H22l9-45h.5l13.5 45h21.5l14-65H64l-9 45h-.5l-13-45Zm63 0h-18l-13 65h17l6-28H117l-5.5 28H129l13.5-65H125L119.5 32h-20l5-24.5Z"/>
   </svg>
 {% endset %}
 
@@ -16,9 +15,9 @@
 {%- if params.organisation and params.organisation.name %} nhsuk-header--organisation{% endif %}
 {%- if params.classes %} {{ params.classes }}{% endif %}" role="banner"
 {{- nhsukAttributes(params.attributes) }}>
-  
+
   <div class="nhsuk-header__container">
-    <div class="nhsuk-header__logo 
+    <div class="nhsuk-header__logo
     {%- if showNav == "false" and showSearch == "false" and params.transactionalService %} nhsuk-header__transactional--logo{% endif %}
     {%- if showNav == "false" and showSearch == "false" and not params.transactionalService %} nhsuk-header__logo--only{% endif %}">
       {%- if params.organisation %}
@@ -42,7 +41,7 @@
       </a>
       {%- endif %}
     </div>
-    
+
 
     {%- if showNav == "false" and showSearch == "false"%}
 
@@ -50,11 +49,11 @@
         <div class="nhsuk-header__transactional-service-name">
           <a class="nhsuk-header__transactional-service-name--link" href="{% if params.transactionalService.href %}{{ params.transactionalService.href }}{% else %}/{% endif %}">{{ params.transactionalService.name }}</a>
         </div>
-        
+
       {%- endif %}
 
     </div>{# close nhsuk-header__container #}
-    
+
 
     {% endif -%}
 
@@ -135,7 +134,7 @@
     {% if showNav == "true" and params.primaryLinks and showSearch == "false" %}
 
     </div>{# close nhsuk-header__container #}
-    
+
     <div class="nhsuk-navigation-container">
       <nav class="nhsuk-navigation" id="header-navigation" role="navigation" aria-label="Primary navigation">
         <ul class="nhsuk-header__navigation-list {%- if params.primaryLinks.length < 4 %} nhsuk-header__navigation-list--left-aligned{% endif %}">

From fde9400e497fd568b8cb08d1c5f80ae0fa2697a2 Mon Sep 17 00:00:00 2001
From: Paul Robert Lloyd <me+git@paulrobertlloyd.com>
Date: Wed, 9 Oct 2024 23:53:00 +0100
Subject: [PATCH 2/5] Update CHANGELOG with updated SVG logo

---
 CHANGELOG.md | 23 +++++++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index f8fd2e5a1..d3696e1ef 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,28 @@
 # NHS.UK frontend Changelog
 
+## Unreleased
+
+:boom: **Breaking changes**
+
+- The NHS logo in the header has been updated so that it can have higher contrast when focused. ([PR 1047]([https://github.com/nhsuk/nhsuk-frontend/pull/1047]))
+
+  Previously the logo used the following SVG:
+
+  ```svg
+  <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100">
+    <path class="nhsuk-logo__background" fill="#005eb8" d="M0 0h40v16H0z"></path>
+    <path class="nhsuk-logo__text" fill="#fff" d="M3.9 1.5h4.4l2.6 9h.1l1.8-9h3.3l-2.8 13H9l-2.7-9h-.1l-1.8 9H1.1M17.3 1.5h3.6l-1 4.9h4L25 1.5h3.5l-2.7 13h-3.5l1.1-5.6h-4.1l-1.2 5.6h-3.4M37.7 4.4c-.7-.3-1.6-.6-2.9-.6-1.4 0-2.5.2-2.5 1.3 0 1.8 5.1 1.2 5.1 5.1 0 3.6-3.3 4.5-6.4 4.5-1.3 0-2.9-.3-4-.7l.8-2.7c.7.4 2.1.7 3.2.7s2.8-.2 2.8-1.5c0-2.1-5.1-1.3-5.1-5 0-3.4 2.9-4.4 5.8-4.4 1.6 0 3.1.2 4 .6"></path>
+  </svg>
+  ```
+
+  This has been updated to use the following SVG:
+
+  ```svg
+  <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 80" height="40" width="100">
+    <path fill="currentcolor" d="M200 0v80H0V0h200Zm-27.5 5.5c-14.5 0-29 5-29 22 0 10.2 7.7 13.5 14.7 16.3l.7.3c5.4 2 10.1 3.9 10.1 8.4 0 6.5-8.5 7.5-14 7.5s-12.5-1.5-16-3.5L135 70c5.5 2 13.5 3.5 20 3.5 15.5 0 32-4.5 32-22.5 0-19.5-25.5-16.5-25.5-25.5 0-5.5 5.5-6.5 12.5-6.5a35 35 0 0 1 14.5 3l4-13.5c-4.5-2-12-3-20-3Zm-131 2h-22l-14 65H22l9-45h.5l13.5 45h21.5l14-65H64l-9 45h-.5l-13-45Zm63 0h-18l-13 65h17l6-28H117l-5.5 28H129l13.5-65H125L119.5 32h-20l5-24.5Z"/>
+  </svg>
+  ```
+
 ## 9.0.1 - 9 October 2024
 
 :wrench: **Fixes**

From 6888c2b57b6191022676e4ee9af8efc2bf226564 Mon Sep 17 00:00:00 2001
From: Paul Robert Lloyd <me+git@paulrobertlloyd.com>
Date: Wed, 9 Oct 2024 23:54:47 +0100
Subject: [PATCH 3/5] Update SVG in README for header component

---
 packages/components/header/README.md | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/packages/components/header/README.md b/packages/components/header/README.md
index 2952f86d8..fb01b40b1 100644
--- a/packages/components/header/README.md
+++ b/packages/components/header/README.md
@@ -22,7 +22,7 @@ compiled JavaScript for all components `nhsuk.min.js` or the individual componen
   <div class="nhsuk-width-container nhsuk-header__container">
     <div class="nhsuk-header__logo">
       <a class="nhsuk-header__link" href="/" aria-label="NHS homepage">
-        <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100"><path class="nhsuk-logo__background" fill="#005eb8" d="M0 0h40v16H0z"></path><path class="nhsuk-logo__text" fill="#fff" d="M3.9 1.5h4.4l2.6 9h.1l1.8-9h3.3l-2.8 13H9l-2.7-9h-.1l-1.8 9H1.1M17.3 1.5h3.6l-1 4.9h4L25 1.5h3.5l-2.7 13h-3.5l1.1-5.6h-4.1l-1.2 5.6h-3.4M37.7 4.4c-.7-.3-1.6-.6-2.9-.6-1.4 0-2.5.2-2.5 1.3 0 1.8 5.1 1.2 5.1 5.1 0 3.6-3.3 4.5-6.4 4.5-1.3 0-2.9-.3-4-.7l.8-2.7c.7.4 2.1.7 3.2.7s2.8-.2 2.8-1.5c0-2.1-5.1-1.3-5.1-5 0-3.4 2.9-4.4 5.8-4.4 1.6 0 3.1.2 4 .6"></path></svg>
+        <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100"><path fill="currentcolor" d="M200 0v80H0V0h200Zm-27.5 5.5c-14.5 0-29 5-29 22 0 10.2 7.7 13.5 14.7 16.3l.7.3c5.4 2 10.1 3.9 10.1 8.4 0 6.5-8.5 7.5-14 7.5s-12.5-1.5-16-3.5L135 70c5.5 2 13.5 3.5 20 3.5 15.5 0 32-4.5 32-22.5 0-19.5-25.5-16.5-25.5-25.5 0-5.5 5.5-6.5 12.5-6.5a35 35 0 0 1 14.5 3l4-13.5c-4.5-2-12-3-20-3Zm-131 2h-22l-14 65H22l9-45h.5l13.5 45h21.5l14-65H64l-9 45h-.5l-13-45Zm63 0h-18l-13 65h17l6-28H117l-5.5 28H129l13.5-65H125L119.5 32h-20l5-24.5Z"/></svg>
       </a>
     </div>
     <div class="nhsuk-header__content" id="content-header">
@@ -151,7 +151,7 @@ compiled JavaScript for all components `nhsuk.min.js` or the individual componen
   <div class="nhsuk-width-container nhsuk-header__container">
     <div class="nhsuk-header__logo">
       <a class="nhsuk-header__link" href="/" aria-label="NHS homepage">
-        <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100"><path class="nhsuk-logo__background" fill="#005eb8" d="M0 0h40v16H0z"></path><path class="nhsuk-logo__text" fill="#fff" d="M3.9 1.5h4.4l2.6 9h.1l1.8-9h3.3l-2.8 13H9l-2.7-9h-.1l-1.8 9H1.1M17.3 1.5h3.6l-1 4.9h4L25 1.5h3.5l-2.7 13h-3.5l1.1-5.6h-4.1l-1.2 5.6h-3.4M37.7 4.4c-.7-.3-1.6-.6-2.9-.6-1.4 0-2.5.2-2.5 1.3 0 1.8 5.1 1.2 5.1 5.1 0 3.6-3.3 4.5-6.4 4.5-1.3 0-2.9-.3-4-.7l.8-2.7c.7.4 2.1.7 3.2.7s2.8-.2 2.8-1.5c0-2.1-5.1-1.3-5.1-5 0-3.4 2.9-4.4 5.8-4.4 1.6 0 3.1.2 4 .6"></path></svg>
+        <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100"><path fill="currentcolor" d="M200 0v80H0V0h200Zm-27.5 5.5c-14.5 0-29 5-29 22 0 10.2 7.7 13.5 14.7 16.3l.7.3c5.4 2 10.1 3.9 10.1 8.4 0 6.5-8.5 7.5-14 7.5s-12.5-1.5-16-3.5L135 70c5.5 2 13.5 3.5 20 3.5 15.5 0 32-4.5 32-22.5 0-19.5-25.5-16.5-25.5-25.5 0-5.5 5.5-6.5 12.5-6.5a35 35 0 0 1 14.5 3l4-13.5c-4.5-2-12-3-20-3Zm-131 2h-22l-14 65H22l9-45h.5l13.5 45h21.5l14-65H64l-9 45h-.5l-13-45Zm63 0h-18l-13 65h17l6-28H117l-5.5 28H129l13.5-65H125L119.5 32h-20l5-24.5Z"/></svg>
       </a>
     </div>
   </div>
@@ -264,7 +264,7 @@ compiled JavaScript for all components `nhsuk.min.js` or the individual componen
   <div class="nhsuk-width-container nhsuk-header__container">
     <div class="nhsuk-header__logo">
       <a class="nhsuk-header__link" href="/" aria-label="NHS homepage">
-        <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100"><path class="nhsuk-logo__background" fill="#005eb8" d="M0 0h40v16H0z"></path><path class="nhsuk-logo__text" fill="#fff" d="M3.9 1.5h4.4l2.6 9h.1l1.8-9h3.3l-2.8 13H9l-2.7-9h-.1l-1.8 9H1.1M17.3 1.5h3.6l-1 4.9h4L25 1.5h3.5l-2.7 13h-3.5l1.1-5.6h-4.1l-1.2 5.6h-3.4M37.7 4.4c-.7-.3-1.6-.6-2.9-.6-1.4 0-2.5.2-2.5 1.3 0 1.8 5.1 1.2 5.1 5.1 0 3.6-3.3 4.5-6.4 4.5-1.3 0-2.9-.3-4-.7l.8-2.7c.7.4 2.1.7 3.2.7s2.8-.2 2.8-1.5c0-2.1-5.1-1.3-5.1-5 0-3.4 2.9-4.4 5.8-4.4 1.6 0 3.1.2 4 .6"></path></svg>
+        <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100"><path fill="currentcolor" d="M200 0v80H0V0h200Zm-27.5 5.5c-14.5 0-29 5-29 22 0 10.2 7.7 13.5 14.7 16.3l.7.3c5.4 2 10.1 3.9 10.1 8.4 0 6.5-8.5 7.5-14 7.5s-12.5-1.5-16-3.5L135 70c5.5 2 13.5 3.5 20 3.5 15.5 0 32-4.5 32-22.5 0-19.5-25.5-16.5-25.5-25.5 0-5.5 5.5-6.5 12.5-6.5a35 35 0 0 1 14.5 3l4-13.5c-4.5-2-12-3-20-3Zm-131 2h-22l-14 65H22l9-45h.5l13.5 45h21.5l14-65H64l-9 45h-.5l-13-45Zm63 0h-18l-13 65h17l6-28H117l-5.5 28H129l13.5-65H125L119.5 32h-20l5-24.5Z"/></svg>
       </a>
     </div>
     <div class="nhsuk-header__content" id="content-header">
@@ -334,7 +334,7 @@ compiled JavaScript for all components `nhsuk.min.js` or the individual componen
   <div class="nhsuk-width-container nhsuk-header__container">
     <div class="nhsuk-header__logo nhsuk-header__logo--only">
       <a class="nhsuk-header__link" href="/" aria-label="NHS homepage">
-        <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100"><path class="nhsuk-logo__background" fill="#005eb8" d="M0 0h40v16H0z"></path><path class="nhsuk-logo__text" fill="#fff" d="M3.9 1.5h4.4l2.6 9h.1l1.8-9h3.3l-2.8 13H9l-2.7-9h-.1l-1.8 9H1.1M17.3 1.5h3.6l-1 4.9h4L25 1.5h3.5l-2.7 13h-3.5l1.1-5.6h-4.1l-1.2 5.6h-3.4M37.7 4.4c-.7-.3-1.6-.6-2.9-.6-1.4 0-2.5.2-2.5 1.3 0 1.8 5.1 1.2 5.1 5.1 0 3.6-3.3 4.5-6.4 4.5-1.3 0-2.9-.3-4-.7l.8-2.7c.7.4 2.1.7 3.2.7s2.8-.2 2.8-1.5c0-2.1-5.1-1.3-5.1-5 0-3.4 2.9-4.4 5.8-4.4 1.6 0 3.1.2 4 .6"></path></svg>
+        <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100"><path fill="currentcolor" d="M200 0v80H0V0h200Zm-27.5 5.5c-14.5 0-29 5-29 22 0 10.2 7.7 13.5 14.7 16.3l.7.3c5.4 2 10.1 3.9 10.1 8.4 0 6.5-8.5 7.5-14 7.5s-12.5-1.5-16-3.5L135 70c5.5 2 13.5 3.5 20 3.5 15.5 0 32-4.5 32-22.5 0-19.5-25.5-16.5-25.5-25.5 0-5.5 5.5-6.5 12.5-6.5a35 35 0 0 1 14.5 3l4-13.5c-4.5-2-12-3-20-3Zm-131 2h-22l-14 65H22l9-45h.5l13.5 45h21.5l14-65H64l-9 45h-.5l-13-45Zm63 0h-18l-13 65h17l6-28H117l-5.5 28H129l13.5-65H125L119.5 32h-20l5-24.5Z"/></svg>
       </a>
     </div>
   </div>
@@ -366,7 +366,7 @@ compiled JavaScript for all components `nhsuk.min.js` or the individual componen
   <div class="nhsuk-width-container nhsuk-header__container">
     <div class="nhsuk-header__logo nhsuk-header__transactional--logo">
       <a class="nhsuk-header__link" href="/" aria-label="NHS homepage">
-        <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100"><path class="nhsuk-logo__background" fill="#005eb8" d="M0 0h40v16H0z"></path><path class="nhsuk-logo__text" fill="#fff" d="M3.9 1.5h4.4l2.6 9h.1l1.8-9h3.3l-2.8 13H9l-2.7-9h-.1l-1.8 9H1.1M17.3 1.5h3.6l-1 4.9h4L25 1.5h3.5l-2.7 13h-3.5l1.1-5.6h-4.1l-1.2 5.6h-3.4M37.7 4.4c-.7-.3-1.6-.6-2.9-.6-1.4 0-2.5.2-2.5 1.3 0 1.8 5.1 1.2 5.1 5.1 0 3.6-3.3 4.5-6.4 4.5-1.3 0-2.9-.3-4-.7l.8-2.7c.7.4 2.1.7 3.2.7s2.8-.2 2.8-1.5c0-2.1-5.1-1.3-5.1-5 0-3.4 2.9-4.4 5.8-4.4 1.6 0 3.1.2 4 .6"></path></svg>
+        <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100"><path fill="currentcolor" d="M200 0v80H0V0h200Zm-27.5 5.5c-14.5 0-29 5-29 22 0 10.2 7.7 13.5 14.7 16.3l.7.3c5.4 2 10.1 3.9 10.1 8.4 0 6.5-8.5 7.5-14 7.5s-12.5-1.5-16-3.5L135 70c5.5 2 13.5 3.5 20 3.5 15.5 0 32-4.5 32-22.5 0-19.5-25.5-16.5-25.5-25.5 0-5.5 5.5-6.5 12.5-6.5a35 35 0 0 1 14.5 3l4-13.5c-4.5-2-12-3-20-3Zm-131 2h-22l-14 65H22l9-45h.5l13.5 45h21.5l14-65H64l-9 45h-.5l-13-45Zm63 0h-18l-13 65h17l6-28H117l-5.5 28H129l13.5-65H125L119.5 32h-20l5-24.5Z"/></svg>
       </a>
     </div>
     <div class="nhsuk-header__transactional-service-name">
@@ -403,7 +403,7 @@ compiled JavaScript for all components `nhsuk.min.js` or the individual componen
   <div class="nhsuk-width-container nhsuk-header__container">
     <div class="nhsuk-header__logo">
       <a class="nhsuk-header__link" href="/" aria-label="Anytown Anyplace Anywhere NHS Foundation Trust homepage">
-        <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100"><path class="nhsuk-logo__background" fill="#005eb8" d="M0 0h40v16H0z"></path><path class="nhsuk-logo__text" fill="#fff" d="M3.9 1.5h4.4l2.6 9h.1l1.8-9h3.3l-2.8 13H9l-2.7-9h-.1l-1.8 9H1.1M17.3 1.5h3.6l-1 4.9h4L25 1.5h3.5l-2.7 13h-3.5l1.1-5.6h-4.1l-1.2 5.6h-3.4M37.7 4.4c-.7-.3-1.6-.6-2.9-.6-1.4 0-2.5.2-2.5 1.3 0 1.8 5.1 1.2 5.1 5.1 0 3.6-3.3 4.5-6.4 4.5-1.3 0-2.9-.3-4-.7l.8-2.7c.7.4 2.1.7 3.2.7s2.8-.2 2.8-1.5c0-2.1-5.1-1.3-5.1-5 0-3.4 2.9-4.4 5.8-4.4 1.6 0 3.1.2 4 .6"></path></svg>
+        <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100"><path fill="currentcolor" d="M200 0v80H0V0h200Zm-27.5 5.5c-14.5 0-29 5-29 22 0 10.2 7.7 13.5 14.7 16.3l.7.3c5.4 2 10.1 3.9 10.1 8.4 0 6.5-8.5 7.5-14 7.5s-12.5-1.5-16-3.5L135 70c5.5 2 13.5 3.5 20 3.5 15.5 0 32-4.5 32-22.5 0-19.5-25.5-16.5-25.5-25.5 0-5.5 5.5-6.5 12.5-6.5a35 35 0 0 1 14.5 3l4-13.5c-4.5-2-12-3-20-3Zm-131 2h-22l-14 65H22l9-45h.5l13.5 45h21.5l14-65H64l-9 45h-.5l-13-45Zm63 0h-18l-13 65h17l6-28H117l-5.5 28H129l13.5-65H125L119.5 32h-20l5-24.5Z"/></svg>
         <span class="nhsuk-organisation-name">Anytown Anyplace <span class="nhsuk-organisation-name-split">Anywhere</span></span>
         <span class="nhsuk-organisation-descriptor">NHS Foundation Trust</span>
       </a>
@@ -527,7 +527,7 @@ compiled JavaScript for all components `nhsuk.min.js` or the individual componen
   <div class="nhsuk-width-container nhsuk-header__container">
     <div class="nhsuk-header__logo">
       <a class="nhsuk-header__link" href="/" aria-label="Anytown Anyplace Anywhere NHS Foundation Trust homepage">
-        <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100"><path class="nhsuk-logo__background" fill="#005eb8" d="M0 0h40v16H0z"></path><path class="nhsuk-logo__text" fill="#fff" d="M3.9 1.5h4.4l2.6 9h.1l1.8-9h3.3l-2.8 13H9l-2.7-9h-.1l-1.8 9H1.1M17.3 1.5h3.6l-1 4.9h4L25 1.5h3.5l-2.7 13h-3.5l1.1-5.6h-4.1l-1.2 5.6h-3.4M37.7 4.4c-.7-.3-1.6-.6-2.9-.6-1.4 0-2.5.2-2.5 1.3 0 1.8 5.1 1.2 5.1 5.1 0 3.6-3.3 4.5-6.4 4.5-1.3 0-2.9-.3-4-.7l.8-2.7c.7.4 2.1.7 3.2.7s2.8-.2 2.8-1.5c0-2.1-5.1-1.3-5.1-5 0-3.4 2.9-4.4 5.8-4.4 1.6 0 3.1.2 4 .6"></path></svg>
+        <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100"><path fill="currentcolor" d="M200 0v80H0V0h200Zm-27.5 5.5c-14.5 0-29 5-29 22 0 10.2 7.7 13.5 14.7 16.3l.7.3c5.4 2 10.1 3.9 10.1 8.4 0 6.5-8.5 7.5-14 7.5s-12.5-1.5-16-3.5L135 70c5.5 2 13.5 3.5 20 3.5 15.5 0 32-4.5 32-22.5 0-19.5-25.5-16.5-25.5-25.5 0-5.5 5.5-6.5 12.5-6.5a35 35 0 0 1 14.5 3l4-13.5c-4.5-2-12-3-20-3Zm-131 2h-22l-14 65H22l9-45h.5l13.5 45h21.5l14-65H64l-9 45h-.5l-13-45Zm63 0h-18l-13 65h17l6-28H117l-5.5 28H129l13.5-65H125L119.5 32h-20l5-24.5Z"/></svg>
         <span class="nhsuk-organisation-name">Anytown Anyplace <span class="nhsuk-organisation-name-split">Anywhere</span></span>
         <span class="nhsuk-organisation-descriptor">NHS Foundation Trust</span>
       </a>
@@ -652,7 +652,7 @@ compiled JavaScript for all components `nhsuk.min.js` or the individual componen
   <div class="nhsuk-width-container nhsuk-header__container">
     <div class="nhsuk-header__logo">
       <a class="nhsuk-header__link" href="/" aria-label="Anytown Anyplace Anywhere NHS Foundation Trust homepage">
-        <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100"><path class="nhsuk-logo__background" fill="#005eb8" d="M0 0h40v16H0z"></path><path class="nhsuk-logo__text" fill="#fff" d="M3.9 1.5h4.4l2.6 9h.1l1.8-9h3.3l-2.8 13H9l-2.7-9h-.1l-1.8 9H1.1M17.3 1.5h3.6l-1 4.9h4L25 1.5h3.5l-2.7 13h-3.5l1.1-5.6h-4.1l-1.2 5.6h-3.4M37.7 4.4c-.7-.3-1.6-.6-2.9-.6-1.4 0-2.5.2-2.5 1.3 0 1.8 5.1 1.2 5.1 5.1 0 3.6-3.3 4.5-6.4 4.5-1.3 0-2.9-.3-4-.7l.8-2.7c.7.4 2.1.7 3.2.7s2.8-.2 2.8-1.5c0-2.1-5.1-1.3-5.1-5 0-3.4 2.9-4.4 5.8-4.4 1.6 0 3.1.2 4 .6"></path></svg>
+        <svg class="nhsuk-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 16" height="40" width="100"><path fill="currentcolor" d="M200 0v80H0V0h200Zm-27.5 5.5c-14.5 0-29 5-29 22 0 10.2 7.7 13.5 14.7 16.3l.7.3c5.4 2 10.1 3.9 10.1 8.4 0 6.5-8.5 7.5-14 7.5s-12.5-1.5-16-3.5L135 70c5.5 2 13.5 3.5 20 3.5 15.5 0 32-4.5 32-22.5 0-19.5-25.5-16.5-25.5-25.5 0-5.5 5.5-6.5 12.5-6.5a35 35 0 0 1 14.5 3l4-13.5c-4.5-2-12-3-20-3Zm-131 2h-22l-14 65H22l9-45h.5l13.5 45h21.5l14-65H64l-9 45h-.5l-13-45Zm63 0h-18l-13 65h17l6-28H117l-5.5 28H129l13.5-65H125L119.5 32h-20l5-24.5Z"/></svg>
         <span class="nhsuk-organisation-name">Anytown Anyplace <span class="nhsuk-organisation-name-split">Anywhere</span></span>
         <span class="nhsuk-organisation-descriptor">NHS Foundation Trust</span>
       </a>

From a2e1125df88d807e1a83e71110e5d345366ec8b6 Mon Sep 17 00:00:00 2001
From: Paul Robert Lloyd <me+git@paulrobertlloyd.com>
Date: Wed, 9 Oct 2024 23:59:08 +0100
Subject: [PATCH 4/5] Format header styles with Prettier

---
 packages/components/header/_header-organisation.scss |  3 +--
 packages/components/header/_header-service.scss      |  4 +---
 packages/components/header/_header.scss              | 11 +++--------
 3 files changed, 5 insertions(+), 13 deletions(-)

diff --git a/packages/components/header/_header-organisation.scss b/packages/components/header/_header-organisation.scss
index f2715badc..94df27a70 100644
--- a/packages/components/header/_header-organisation.scss
+++ b/packages/components/header/_header-organisation.scss
@@ -19,8 +19,7 @@
 
     &:focus {
       background: $nhsuk-focus-color;
-      box-shadow:
-        0 0 0 $nhsuk-focus-width $nhsuk-focus-color,
+      box-shadow: 0 0 0 $nhsuk-focus-width $nhsuk-focus-color,
         0 $nhsuk-focus-width 0 $nhsuk-focus-width $nhsuk-focus-text-color;
 
       .nhsuk-organisation-name,
diff --git a/packages/components/header/_header-service.scss b/packages/components/header/_header-service.scss
index 5b2595ca9..99ab5d1bc 100644
--- a/packages/components/header/_header-service.scss
+++ b/packages/components/header/_header-service.scss
@@ -16,11 +16,9 @@
     width: auto;
   }
 
-
   &:focus {
     background: $nhsuk-focus-color;
-    box-shadow:
-      0 0 0 $nhsuk-focus-width $nhsuk-focus-color,
+    box-shadow: 0 0 0 $nhsuk-focus-width $nhsuk-focus-color,
       0 $nhsuk-focus-width 0 $nhsuk-focus-width $nhsuk-focus-text-color;
 
     .nhsuk-header__service-name {
diff --git a/packages/components/header/_header.scss b/packages/components/header/_header.scss
index f6b052f29..bca9c9eb7 100644
--- a/packages/components/header/_header.scss
+++ b/packages/components/header/_header.scss
@@ -72,8 +72,7 @@
   &:focus {
     .nhsuk-logo {
       background-color: $nhsuk-focus-color;
-      box-shadow:
-        0 0 0 $nhsuk-focus-width $nhsuk-focus-color,
+      box-shadow: 0 0 0 $nhsuk-focus-width $nhsuk-focus-color,
         0 $nhsuk-focus-width 0 $nhsuk-focus-width $nhsuk-focus-text-color;
     }
   }
@@ -260,9 +259,7 @@
 
     &:focus {
       background-color: $nhsuk-focus-color;
-      box-shadow:
-        0 -4px $nhsuk-focus-color,
-        0 $nhsuk-focus-width $nhsuk-focus-text-color;
+      box-shadow: 0 -4px $nhsuk-focus-color, 0 $nhsuk-focus-width $nhsuk-focus-text-color;
       outline: $nhsuk-focus-width solid transparent;
       outline-offset: $nhsuk-focus-width;
 
@@ -303,9 +300,7 @@
 
     &:focus {
       @include nhsuk-focused-button();
-      box-shadow:
-        0 -2px $nhsuk-focus-color,
-        0 $nhsuk-focus-width $nhsuk-focus-text-color;
+      box-shadow: 0 -2px $nhsuk-focus-color, 0 $nhsuk-focus-width $nhsuk-focus-text-color;
     }
 
     &:active {

From 55cb702102aa06918b0e3d10d27889e8efcfcf62 Mon Sep 17 00:00:00 2001
From: anandamaryon1 <anandamaryon@gmail.com>
Date: Tue, 22 Oct 2024 15:31:11 +0100
Subject: [PATCH 5/5] format with prettier

---
 packages/components/header/_header-organisation.scss |  3 ++-
 packages/components/header/_header-service.scss      |  3 ++-
 packages/components/header/_header.scss              | 11 ++++++++---
 3 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/packages/components/header/_header-organisation.scss b/packages/components/header/_header-organisation.scss
index 94df27a70..f2715badc 100644
--- a/packages/components/header/_header-organisation.scss
+++ b/packages/components/header/_header-organisation.scss
@@ -19,7 +19,8 @@
 
     &:focus {
       background: $nhsuk-focus-color;
-      box-shadow: 0 0 0 $nhsuk-focus-width $nhsuk-focus-color,
+      box-shadow:
+        0 0 0 $nhsuk-focus-width $nhsuk-focus-color,
         0 $nhsuk-focus-width 0 $nhsuk-focus-width $nhsuk-focus-text-color;
 
       .nhsuk-organisation-name,
diff --git a/packages/components/header/_header-service.scss b/packages/components/header/_header-service.scss
index 99ab5d1bc..05d85957f 100644
--- a/packages/components/header/_header-service.scss
+++ b/packages/components/header/_header-service.scss
@@ -18,7 +18,8 @@
 
   &:focus {
     background: $nhsuk-focus-color;
-    box-shadow: 0 0 0 $nhsuk-focus-width $nhsuk-focus-color,
+    box-shadow:
+      0 0 0 $nhsuk-focus-width $nhsuk-focus-color,
       0 $nhsuk-focus-width 0 $nhsuk-focus-width $nhsuk-focus-text-color;
 
     .nhsuk-header__service-name {
diff --git a/packages/components/header/_header.scss b/packages/components/header/_header.scss
index bca9c9eb7..f6b052f29 100644
--- a/packages/components/header/_header.scss
+++ b/packages/components/header/_header.scss
@@ -72,7 +72,8 @@
   &:focus {
     .nhsuk-logo {
       background-color: $nhsuk-focus-color;
-      box-shadow: 0 0 0 $nhsuk-focus-width $nhsuk-focus-color,
+      box-shadow:
+        0 0 0 $nhsuk-focus-width $nhsuk-focus-color,
         0 $nhsuk-focus-width 0 $nhsuk-focus-width $nhsuk-focus-text-color;
     }
   }
@@ -259,7 +260,9 @@
 
     &:focus {
       background-color: $nhsuk-focus-color;
-      box-shadow: 0 -4px $nhsuk-focus-color, 0 $nhsuk-focus-width $nhsuk-focus-text-color;
+      box-shadow:
+        0 -4px $nhsuk-focus-color,
+        0 $nhsuk-focus-width $nhsuk-focus-text-color;
       outline: $nhsuk-focus-width solid transparent;
       outline-offset: $nhsuk-focus-width;
 
@@ -300,7 +303,9 @@
 
     &:focus {
       @include nhsuk-focused-button();
-      box-shadow: 0 -2px $nhsuk-focus-color, 0 $nhsuk-focus-width $nhsuk-focus-text-color;
+      box-shadow:
+        0 -2px $nhsuk-focus-color,
+        0 $nhsuk-focus-width $nhsuk-focus-text-color;
     }
 
     &:active {