Merge pull request nhsuk#297 from nhsuk/refactor/header-aria-label

[refs nhsuk#288] Add 'aria-label' Nunjucks argument to header
NawazZeeshan · Dec 13, 2018 · f707f4a · f707f4a
2 parents 68774ac + 9c9dac7
commit f707f4a
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 1 deletion.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,11 @@
 # NHS.UK Frontend Changelog
 
+## 0.5.3 (Prerelease) - Dec 13, 2018
+
+:new: **New features**
+
+- Header - Add 'aria-label' Nunjucks argument so it can be overridden  ([PR 297](https://github.com/nhsuk/nhsuk-frontend/pull/297))
+
 ## 0.5.2 (Prerelease) - Dec 12, 2018
 
 :wrench: **Fixes**

diff --git a/packages/components/header/README.md b/packages/components/header/README.md
@@ -614,3 +614,4 @@ The transactional header with a long service name macro takes the following argu
 | **name**                   | string   | Yes       | The name of the service. |
 | **longName**               | boolean  | Yes       | Set to "true" if the service name is longer than 22 characters. |
 | **homeHref**               | string   | No        | The href of the home link for the logo and mobile home link in the navigation links. Defaults to "/". |
+| **ariaLabel**              | string   | No        | Aria label for the logo href. Defaults to "NHS homepage". |
diff --git a/packages/components/header/template.njk b/packages/components/header/template.njk
@@ -1,7 +1,7 @@
 <header class="nhsuk-header{% if params.transactional or params.transactionalService %} nhsuk-header--transactional{% endif %}" role="banner">
   <div class="nhsuk-width-container nhsuk-header__container">
     <div class="nhsuk-header__logo">
-      <a href="{% if params.homeHref %}{{ params.homeHref }}{% else %}/{% endif %}" class="nhsuk-header__link{% if params.service %} nhsuk-header__link--service {% endif %}" aria-label="NHS homepage">
+      <a href="{% if params.homeHref %}{{ params.homeHref }}{% else %}/{% endif %}" class="nhsuk-header__link{% if params.service %} nhsuk-header__link--service {% endif %}" aria-label="{% if params.ariaLabel %}{{ params.ariaLabel }}{% else %}NHS homepage{% endif %}">
         <svg class="nhsuk-logo nhsuk-logo--white" xmlns="http://www.w3.org/2000/svg" role="presentation" focusable="false" viewBox="0 0 40 16">
           <path fill="#fff" d="M0 0h40v16H0z"></path>
           <path fill="#005eb8" 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>