hof 22.12.0-unit-of-measure-beta.1 → 22.13.0-frontend-v4-beta.1

package/CHANGELOG.md

@@ -1,3 +1,16 @@
+## 2025-12-09, Version 23.0.0 (Stable), @Rhodine-orleans-lindsay
+### Changed
+- Updated cookie banner view to follow GOV.UK design system. Updated cookieSettings.js to allow for different confirmation text based on whether cookies were accepted or rejected
+- Added inputmode='numeric' to date component
+- Added span for checkbox error messages
+- Updated imported javascript
+- Added data-module attribute for govuk-skip-link for screen readers
+- Removed aria-polite=live for character-count and removed pattern attribute for date input
+- Replaced deprecated govuk-header__link--service-name with govuk-header__service-name
+- Added a modifier for phone text input styles that accept sequences of digits
+- Added govuk-template--rebranded class to govuk template html to enable govuk rebrand styles:
+  - Updated header and footer to follow GOV.UK design system as part of rebrand
+
 ## 2025-11-20, Version 22.12.0 (Stable), @dk4g @jamiecarterHO
 
 ### Infrastructure  
@@ -31,7 +44,6 @@ For testing purposes, you can use the following command to generate a random val
       - For custom session timeout handling that is not linked to the redis session ttl, The following variables must be set: `CUSTOM_SESSION_EXPIRY` to the relevant expiry time e.g.600 and `USE_CUSTOM_SESSION_TIMEOUT` to true.
       - If a behaviour is required on the '/session-timeout` step, the '/session-timeout' step must be set in the project's index.js, along with any relevant behaviours.
 
-
 ## 2025-10-10, Version 22.10.4 (Stable), @dk4g
 ### Security
 - Upgraded axios version to address a security vulnerability

package/README.md

@@ -1012,83 +1012,6 @@ Using the translation key `fields.field-name.label` will return different values
 
 # HOF Components
 
-## AmountWithUnitSelect Component
-
-A component for handling the rendering, processing, and validation of a text input (amount) field and a select-dropdown input field (unit) used in HOF applications.
-
-### Usage
-
-In your fields config:
-
-```js
-const amountWithUnitSelectComponent = require("hof").components.amountWithUnitSelect;
-
-module.exports = {
-  "amountWithUnitSelect-field": amountWithUnitSelectComponent("amountWithUnitSelect", {
-    mixin: 'input-amount-with-unit-select',
-    amountLabel: "Amount:", // If not specified, defaults to 'Amount'
-    unitLabel: "Unit:", // If not specified, defaults to 'Unit'
-    options: [
-      { "null": "Select..." }, // If a null option is not specified, a default null option with the label 'Select...' is included in the options
-      { "label": "untranslated option label 1", "value": "1" },
-      { "label": "untranslated option label 2", "value": "2" }
-    ],
-    hint: "E.g: 5 Kilogram", 
-    legend: 'Enter An Amount',
-    isPageHeading: 'true',
-    amountOptional: 'false', // If not specified, defaults to false if the required validator is not applied, otherwise true
-    unitOptional: 'true', // If not specified, defaults to false if the required validator is not applied, otherwise true
-    validate: ['alphanum']
-  }),
-};
-```
-
-The above example will create a new AmountWithUnitSelect component with the key `'amountWithUnitSelect-field'`.
-It will set the AmountWithUnitSelect component's text input label to `'Amount:'` (instead of the default `'Amount'`) and the select input label to `'Unit:'` (instead of the default `'Unit'`).
-The component's Select input will have the dropdown options `'Select...'` (mapping to the value `'null'`), `'untranslated option label 1'` (mapping to the value `'1'`), and `'untranslated option label 2'` (mapping to the value `'2'`).
-The component's hint text will be set to `'E.G: 5 Kilogram'`, the field title/legend will be set to `'Enter An Amount'`, and the page heading will be the field's title.
-In terms of validation, the text input (amount) will have the `'required'` validator applied, but the select input (unit) will not (a value will not be required to be selected), and the text field will have the `'alphanum'` validator applied.
-
-### Configuration
-
-The following optional configuration options are supported:
-
-- `validate {String|Array}` – Validators to use on the text input field. The `'alphanum'` and `'required'` validators are likely to be used.  
-- `template` – An absolute path to an alternate template.
-- `amountLabel {String}` – A custom label for the text input field (amount). Defaults to `'Amount'` if omitted. This can also be specified and defined in the field translations. 
-- `unitLabel {String}` – A custom label for the select input field (unit). Defaults to `'Unit'` if omitted. This can also be specified and defined in the field translations.
-- `options {Array}` – A list of labels and corresponding values (options) for the select input field to present. Each option has the format `{ "label": "", "value": ""}`. The default/null option is defined with the format `{ "null": "Select" }` (where the text `'Select'` is the label and can be modified). If the null option is not defined, a default null option will be included in the options with the label `'Select...'`. This can also be specified and defined in the field translations.
-- `hint {String}` – Hint text displayed for both fields. This can also be specified and defined in the field translations.
-- `legend {String}` – Legend text displayed for both fields. This can also be specified and defined in the field translations.
-- `isPageHeading {Boolean}` – Sets the legend as the page heading on single-page questions.
-- `amountOptional {Boolean}` – The text input (amount) defaults to `''` (empty string) if omitted. Defaults to `false`. If the `'required'` validator is defined in the `validate` configuration option, then this configuration is ignored (both fields are made mandatory).
-- `unitOptional {Boolean}` – The select input (unit) defaults to `null` if omitted. Defaults to `false`. If the `'required'` validator is defined in the `validate` configuration option, then this configuration is ignored (both fields are made mandatory).
-
-### Validation Error Messages
-
-In Validation.json (within the translations):
-
-```js
-"amountWithUnitSelect": {
-  "default": "Enter the amount in the correct format; for example, 10 Litres",
-  "alphanum": "The amount must not contain any special characters",
-  "required": "Enter an amount and a unit value"
-},
-"amountWithUnitSelect-unit": {
-  "default": "A valid value must be selected as the amount unit",
-  "required": "A unit must be selected for the amount"
-},
-"amountWithUnitSelect-amount": {
-  "alphanum": "The amount must not be an alphanum"
-}
-```
-
-Validation error messages can be defined for a specific child component that errored by adding a JSON object with a key that has the component's name (I.E. `'amountWithUnitSelect'`) followed by a hyphen and the child component's name (I.E. '-amount' or '-unit'). So to define an error message, for the `'required'` validation error, for specifically the unit component, an `'amountWithUnitSelect-unit'` object can be created (like in the example above) with a validator's name and the error message to show for it respectively, set as a key:value pair in the object (E.G. `"required": "A unit must be selected for the amount" within "amountWithUnitSelect-unit"` - like in the example). 
-Validation error messages defined specifically for child components, for a given type of validation error, (such as `'required'` for `'amountWithUnitSelect-unit'`) will take precedence over error messages defined for the same validation error in the parent. So in this case, the `"required": "Enter an amount and a unit value"` validation message defined in the `"amountWithUnitSelect"` JSON object in the above example will not show when the `"amountWithUnitSelect-unit"` `'required'` validation error message is defined. If there was no `'required'` error message defined for, say, the `"amountWithUnitSelect-amount"` object (like in the example above), the `"amountWithUnitSelect"` object's `'required'` error message would show if the `'required'` validation error is triggered on the 'amount' child component (I.E. When an amount value is not provided).
-The `'default'` catch all validation error message can also be defined in a similar manner for the child components to override the parent component's defined `'default'` error message.
-
-So the example above will create a scenario where `'required'` validation errors triggered on the 'unit' field will display the error message `"A unit must be selected for the amount"` (specified in the `"amountWithUnitSelect-unit"` JSON object). Any `'required'` validation errors triggered on the 'amount' field will display the error message `"Enter an amount and a unit value"` (specified in the `"amountWithUnitSelect"` JSON object - as there is no `'required'` error message defined specifically for the 'amount' field (withing `"amountWithUnitSelect-amount"`)).
-
 ## Date Component
 
 A component for handling the rendering and processing of 3-input date fields used in HOF Applications.
@@ -1720,7 +1643,6 @@ currency
 select
 input-text
 input-date
-input-amount-with-unit-select
 input-text-compound
 input-text-code
 input-number

package/build/tasks/images/index.js

@@ -10,12 +10,27 @@ module.exports = config => {
   if (!config.images) {
     return Promise.resolve();
   }
+  const imagesOutput = config.images.out;
 
-  return new Promise((resolve, reject) => {
-    fs.stat(config.images.src, err => err ? reject(err) : resolve());
-  })
-    .then(() => mkdir(config.images.out))
-    .then(() => spawn('cp', ['-r', config.images.src, config.images.out]))
+  // Due to govuk rebrand logo, images are copied from multiple sources & mapping can cause 'File exists' error.
+  // Remove if exists as a file
+  if (fs.existsSync(imagesOutput) && !fs.lstatSync(imagesOutput).isDirectory()) {
+    fs.unlinkSync(imagesOutput);
+  }
+  // Ensure directory exists
+  if (!fs.existsSync(imagesOutput)) {
+    fs.mkdirSync(imagesOutput, { recursive: true });
+  }
+  const srcs = Array.isArray(config.images.src) ? config.images.src : [config.images.src];
+
+  return Promise.all(srcs.map(src => {
+    if (!fs.existsSync(src)) {
+      console.log(`${chalk.yellow('warning')}: Skipping missing images folder: ${src}`);
+      return Promise.resolve();
+    }
+    return mkdir(imagesOutput)
+      .then(() => spawn('cp', ['-r', `${src}/.`, imagesOutput]));
+  }))
     .catch(e => {
       if (e.code !== 'ENOENT') {
         throw e;

package/build/tasks/watch/index.js

@@ -32,7 +32,14 @@ module.exports = config => {
   }, {});
 
   function triggersTask(file) {
-    return Object.keys(matchers).filter(key => match(file, matchers[key]));
+    return Object.keys(matchers).filter(key => {
+      const pattern = matchers[key];
+      // Only call minimatch if pattern is a non-empty string or array of strings
+      if (Array.isArray(pattern)) {
+        return pattern.some(p => typeof p === 'string' && p.length > 0 && match(file, p));
+      }
+      return typeof pattern === 'string' && pattern.length > 0 && match(file, pattern);
+    });
   }
 
   function restart() {
@@ -94,7 +101,7 @@ module.exports = config => {
     process.stdin.setEncoding('utf8');
     process.stdin.on('data', data => {
       const dataType = (data + '').trim().toLowerCase();
-      if (dataType  === config.watch.restart) {
+      if (dataType === config.watch.restart) {
         restart();
       }
     });
@@ -118,6 +125,7 @@ module.exports = config => {
         const rootDir = require('path').resolve(__dirname, '../../../');
         ignored.push(`${rootDir}/frontend/govuk-template/govuk_template_generated.html`);
         watchLocation = [rootDir, '.'];
+        process.env.SESSION_SECRET = require('crypto').randomBytes(16).toString('hex');
       }
 
       const watcher = chokidar.watch(watchLocation, { ignored });

package/components/date/templates/date.html

@@ -6,7 +6,7 @@
     {{#isPageHeading}}</h1>{{/isPageHeading}}
   </legend>
     {{#hint}}
-      <span id="{{key}}-hint" class="govuk-hint">{{{hint}}}</span>
+      <div id="{{key}}-hint" class="govuk-hint">{{{hint}}}</div>
     {{/hint}}
     {{#error}}
       <p id="{{key}}-error" class="govuk-error-message">

package/components/index.js

@@ -5,7 +5,6 @@ module.exports = {
   clearSession: require('./clear-session'),
   combineAndLoopFields: require('./combine-and-loop-fields'),
   date: require('./date'),
-  amountWithUnitSelect: require('./amount-with-unit-select/amount-with-unit-select'),
   emailer: require('./emailer'),
   homeOfficeCountries: require('./homeoffice-countries'),
   notify: require('./notify'),

package/config/builder-defaults.js

@@ -1,4 +1,8 @@
 'use strict';
+const toolkitImages =
+  process.env.HOF_SANDBOX === 'true'
+    ? '../frontend/toolkit/assets/rebrand/images'
+    : 'node_modules/hof/frontend/toolkit/assets/rebrand/images';
 
 module.exports = {
   browserify: {
@@ -24,8 +28,8 @@ module.exports = {
     shared: 'apps/common/translations/src'
   },
   images: {
-    src: 'assets/images',
-    out: 'public',
+    src: ['assets/rebrand/images', 'assets/images', toolkitImages],
+    out: 'public/images',
     match: 'assets/images/**/*',
     restart: false
   },

package/controller/controller.js

@@ -200,12 +200,10 @@ module.exports = class Controller extends BaseController {
               req.form.errors[key].errorLinkId = key + '-' + field.options[0];
             }
             // eslint-disable-next-line brace-style
-          } else if (field && field.mixin === 'input-date') {
-            // get first field for date input control
+          }
+          // get first field for date input control
+          else if (field && field.mixin === 'input-date') {
             req.form.errors[key].errorLinkId = key + '-day';
-          } else if (field && field.mixin === 'input-amount-with-unit-select') {
-            // get first field for amount-unit input control
-            req.form.errors[key].errorLinkId = key + '-amount';
           } else {
             req.form.errors[key].errorLinkId = key;
           }

package/controller/validation/index.js

@@ -47,7 +47,7 @@ function validate(fields) {
       fields[key].validate = [fields[key].validate];
     }
 
-    if (fields[key].options && !fields[key].groupedFieldsWithOptions) {
+    if (fields[key].options) {
       fields[key].validate = fields[key].validate || [];
       fields[key].validate.push({
         type: 'equal',

package/controller/validation/validators.js

@@ -177,4 +177,5 @@ module.exports = Validators = {
     // eslint-disable-next-line max-len
     return value === '' || Validators.regex(value, /^(([GIR] ?0[A]{2})|((([A-Z][0-9]{1,2})|(([A-Z][A-HJ-Y][0-9]{1,2})|(([A-Z][0-9][A-Z])|([A-Z][A-HJ-Y][0-9]?[A-Z])))) ?[0-9][A-Z]{2}))$/i);
   }
+
 };

package/frontend/govuk-template/build/config.js

@@ -3,6 +3,7 @@
 module.exports = {
   htmlLang: '{{htmlLang}}',
   assetPath: '{{govukAssetPath}}',
+  assetRebrandPath: '{{govukAssetPath}}rebrand/',
   afterHeader: '{{$afterHeader}}{{/afterHeader}}',
   bodyClasses: '{{$bodyClasses}}{{/bodyClasses}}',
   bodyStart: '{{$bodyStart}}{{/bodyStart}}',

package/frontend/govuk-template/build/govuk_template.html

@@ -1,31 +1,24 @@
 
 <!DOCTYPE html>
 <!--[if lt IE 9]><html class="lte-ie8" lang="{{ htmlLang }}"><![endif]-->
-<!--[if gt IE 8]><!--><html lang="{{ htmlLang }}" class="govuk-template"><!--<![endif]-->
+<!--[if gt IE 8]><!--><html lang="{{ htmlLang }}" class="govuk-template--rebranded"><!--<![endif]-->
   <head>
     <meta charset="utf-8" />
     <title>{{ pageTitle }}</title>
     {{{ head }}}
 
-    <link rel="shortcut icon" sizes="16x16 32x32 48x48" href="{{assetPath}}images/favicon.ico" type="image/x-icon">
-      <link rel="mask-icon" href="{{assetPath}}images/govuk-mask-icon.svg" color="#0b0c0c">
-      <link rel="apple-touch-icon" sizes="180x180" href="{{assetPath}}images/govuk-apple-touch-icon-180x180.png">
-      <link rel="apple-touch-icon" sizes="167x167" href="{{assetPath}}images/govuk-apple-touch-icon-167x167.png">
-      <link rel="apple-touch-icon" sizes="152x152" href="{{assetPath}}images/govuk-apple-touch-icon-152x152.png">
-      <link rel="apple-touch-icon" href="{{assetPath}}images/govuk-apple-touch-icon.png">
-
-
-    <meta name="theme-color" content="#0b0c0c" />
-
-    <meta name="viewport" content="width=device-width, initial-scale=1">
-
-
-    <meta property="og:image" content="{{assetPath}}images/opengraph-image.png">
+<meta name="theme-color" content="#1d70b8">
+<meta http-equiv="X-UA-Compatible" content="IE=edge">
+<link rel="icon" sizes="48x48" href="{{assetRebrandPath}}images/favicon.ico">
+<link rel="icon" sizes="any" href="{{assetRebrandPath}}images/favicon.svg" type="image/svg+xml">
+<link rel="mask-icon" href="{{assetRebrandPath}}images/govuk-icon-mask.svg" color="#1d70b8">
+<link rel="apple-touch-icon" href="{{assetRebrandPath}}images/govuk-icon-180.png">
+<link rel="manifest" href="{{assetRebrandPath}}manifest.json">
+<meta property="og:image" content="{{assetRebrandPath}}images/govuk-opengraph-image.png">
   </head>
 
   <body class="{{ bodyClasses }} govuk-template__body  js-enabled" >
-    <script>document.body.className = ((document.body.className) ? document.body.className + ' js-enabled' : 'js-enabled');</script>
-
+    <script>document.body.className += ' js-enabled' + ('noModule' in HTMLScriptElement.prototype ? ' govuk-frontend-supported' : '');</script>
 
 
     <div id="global-cookie-message" class="gem-c-cookie-banner govuk-clearfix" data-module="cookie-banner" role="region" aria-label="cookie banner" data-nosnippet="">
@@ -39,19 +32,13 @@
 
           <div class="govuk-header__logo">
             <a href="{{{ homepageUrl }}}" title="{{ logoLinkTitle }}" id="logo" class="govuk-header__link govuk-header__link--homepage" target="_blank" data-module="track-click" data-track-category="homeLinkClicked" data-track-action="homeHeader">
-			<span class="govuk-header__logotype">
-				<!--[if gt IE 8]><!-->
-          <svg aria-hidden="true" focusable="false" class="govuk-header__logotype-crown" xmlns="http://www.w3.org/2000/svg\" viewBox="0 0 32 30" height="30" width="32">
-            <path fill="currentColor" fill-rule="evenodd"    d="M22.6 10.4c-1 .4-2-.1-2.4-1-.4-.9.1-2 1-2.4.9-.4 2 .1 2.4 1s-.1 2-1 2.4m-5.9 6.7c-.9.4-2-.1-2.4-1-.4-.9.1-2 1-2.4.9-.4 2 .1 2.4 1s-.1 2-1 2.4m10.8-3.7c-1 .4-2-.1-2.4-1-.4-.9.1-2 1-2.4.9-.4 2 .1 2.4 1s0 2-1 2.4m3.3 4.8c-1 .4-2-.1-2.4-1-.4-.9.1-2 1-2.4.9-.4 2 .1 2.4 1s-.1 2-1 2.4M17 4.7l2.3 1.2V2.5l-2.3.7-.2-.2.9-3h-3.4l.9 3-.2.2c-.1.1-2.3-.7-2.3-.7v3.4L15 4.7c.1.1.1.2.2.2l-1.3 4c-.1.2-.1.4-.1.6 0 1.1.8 2 1.9 2.2h.7c1-.2 1.9-1.1 1.9-2.1 0-.2 0-.4-.1-.6l-1.3-4c-.1-.2 0-.2.1-.3m-7.6 5.7c.9.4 2-.1 2.4-1 .4-.9-.1-2-1-2.4-.9-.4-2 .1-2.4 1s0 2 1 2.4m-5 3c.9.4 2-.1 2.4-1 .4-.9-.1-2-1-2.4-.9-.4-2 .1-2.4 1s.1 2 1 2.4m-3.2 4.8c.9.4 2-.1 2.4-1 .4-.9-.1-2-1-2.4-.9-.4-2 .1-2.4 1s0 2 1 2.4m14.8 11c4.4 0 8.6.3 12.3.8 1.1-4.5 2.4-7 3.7-8.8l-2.5-.9c.2 1.3.3 1.9 0 2.7-.4-.4-.8-1.1-1.1-2.3l-1.2 4c.7-.5 1.3-.8 2-.9-1.1 2.5-2.6 3.1-3.5 3-1.1-.2-1.7-1.2-1.5-2.1.3-1.2 1.5-1.5 2.1-.1 1.1-2.3-.8-3-2-2.3 1.9-1.9 2.1-3.5.6-5.6-2.1 1.6-2.1 3.2-1.2 5.5-1.2-1.4-3.2-.6-2.5 1.6.9-1.4 2.1-.5 1.9.8-.2 1.1-1.7 2.1-3.5 1.9-2.7-.2-2.9-2.1-2.9-3.6.7-.1 1.9.5 2.9 1.9l.4-4.3c-1.1 1.1-2.1 1.4-3.2 1.4.4-1.2 2.1-3 2.1-3h-5.4s1.7 1.9 2.1 3c-1.1 0-2.1-.2-3.2-1.4l.4 4.3c1-1.4 2.2-2 2.9-1.9-.1 1.5-.2 3.4-2.9 3.6-1.9.2-3.4-.8-3.5-1.9-.2-1.3 1-2.2 1.9-.8.7-2.3-1.2-3-2.5-1.6.9-2.2.9-3.9-1.2-5.5-1.5 2-1.3 3.7.6 5.6-1.2-.7-3.1 0-2 2.3.6-1.4 1.8-1.1 2.1.1.2.9-.3 1.9-1.5 2.1-.9.2-2.4-.5-3.5-3 .6 0 1.2.3 2 .9l-1.2-4c-.3 1.1-.7 1.9-1.1 2.3-.3-.8-.2-1.4 0-2.7l-2.9.9C1.3 23 2.6 25.5 3.7 30c3.7-.5 7.9-.8 12.3-.8"></path>
-          </svg>
-          <!--<![endif]-->
-          <!--[if IE 8]>
-          <img src="{{ assetPath }}images/govuk-logotype-tudor-crown.png" class="govuk-header__logotype-crown-fallback-image" width="32" height="30" alt="">
-          <![endif]-->
-			</span>
-				<span class="govuk-header__logotype-text">
-				  {{{ globalHeaderText }}}
-				</span>
+                <!--[if gt IE 8]><!-->
+                <div id="govuk-header__logo"></div>
+                <img src="/public/images/govuk-logo.svg" id="govuk-header__logo" alt="Logo" loading="lazy" />
+                  <!--<![endif]-->
+                  <!--[if IE 8]>
+                  <img src="{{ assetRebrandPath }}images/govuk-logotype-tudor-crown.png" class="govuk-header__logotype-crown-fallback-image" width="32" height="30" alt="">
+                  <![endif]-->
             </a>
           </div>
           {{{ insideHeader }}}
@@ -66,25 +53,54 @@
 
     {{{ content }}}
 
-    <footer class="govuk-footer" id="footer" role="contentinfo">
-
+    <footer class="govuk-footer">
       <div class="govuk-width-container">
-        {{{ footerTop }}}
-
+        <svg
+          focusable="false"
+          role="presentation"
+          xmlns="http://www.w3.org/2000/svg"
+          viewBox="0 0 64 60"
+          height="30"
+          width="32"
+          fill="currentcolor" class="govuk-footer__crown">
+          <g>
+            <circle cx="20" cy="17.6" r="3.7" />
+            <circle cx="10.2" cy="23.5" r="3.7" />
+            <circle cx="3.7" cy="33.2" r="3.7" />
+            <circle cx="31.7" cy="30.6" r="3.7" />
+            <circle cx="43.3" cy="17.6" r="3.7" />
+            <circle cx="53.2" cy="23.5" r="3.7" />
+            <circle cx="59.7" cy="33.2" r="3.7" />
+            <circle cx="31.7" cy="30.6" r="3.7" />
+            <path d="M33.1,9.8c.2-.1.3-.3.5-.5l4.6,2.4v-6.8l-4.6,1.5c-.1-.2-.3-.3-.5-.5l1.9-5.9h-6.7l1.9,5.9c-.2.1-.3.3-.5.5l-4.6-1.5v6.8l4.6-2.4c.1.2.3.3.5.5l-2.6,8c-.9,2.8,1.2,5.7,4.1,5.7h0c3,0,5.1-2.9,4.1-5.7l-2.6-8ZM37,37.9s-3.4,3.8-4.1,6.1c2.2,0,4.2-.5,6.4-2.8l-.7,8.5c-2-2.8-4.4-4.1-5.7-3.8.1,3.1.5,6.7,5.8,7.2,3.7.3,6.7-1.5,7-3.8.4-2.6-2-4.3-3.7-1.6-1.4-4.5,2.4-6.1,4.9-3.2-1.9-4.5-1.8-7.7,2.4-10.9,3,4,2.6,7.3-1.2,11.1,2.4-1.3,6.2,0,4,4.6-1.2-2.8-3.7-2.2-4.2.2-.3,1.7.7,3.7,3,4.2,1.9.3,4.7-.9,7-5.9-1.3,0-2.4.7-3.9,1.7l2.4-8c.6,2.3,1.4,3.7,2.2,4.5.6-1.6.5-2.8,0-5.3l5,1.8c-2.6,3.6-5.2,8.7-7.3,17.5-7.4-1.1-15.7-1.7-24.5-1.7h0c-8.8,0-17.1.6-24.5,1.7-2.1-8.9-4.7-13.9-7.3-17.5l5-1.8c-.5,2.5-.6,3.7,0,5.3.8-.8,1.6-2.3,2.2-4.5l2.4,8c-1.5-1-2.6-1.7-3.9-1.7,2.3,5,5.2,6.2,7,5.9,2.3-.4,3.3-2.4,3-4.2-.5-2.4-3-3.1-4.2-.2-2.2-4.6,1.6-6,4-4.6-3.7-3.7-4.2-7.1-1.2-11.1,4.2,3.2,4.3,6.4,2.4,10.9,2.5-2.8,6.3-1.3,4.9,3.2-1.8-2.7-4.1-1-3.7,1.6.3,2.3,3.3,4.1,7,3.8,5.4-.5,5.7-4.2,5.8-7.2-1.3-.2-3.7,1-5.7,3.8l-.7-8.5c2.2,2.3,4.2,2.7,6.4,2.8-.7-2.3-4.1-6.1-4.1-6.1h10.6,0Z" />
+          </g>
+        </svg>
         <div class="govuk-footer__meta">
           <div class="govuk-footer__meta-item govuk-footer__meta-item--grow">
-		        <h2 class="govuk-visually-hidden">Support links</h2>
+            <h2 class="govuk-visually-hidden">Support links</h2>
             {{{ footerSupportLinks }}}
-
-			      <svg aria-hidden="true" focusable="false" class="govuk-footer__licence-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 483.2 195.7" height="17" width="41">
-                <path fill="currentColor" d="M421.5 142.8V.1l-50.7 32.3v161.1h112.4v-50.7zm-122.3-9.6A47.12 47.12 0 0 1 221 97.8c0-26 21.1-47.1 47.1-47.1 16.7 0 31.4 8.7 39.7 21.8l42.7-27.2A97.63 97.63 0 0 0 268.1 0c-36.5 0-68.3 20.1-85.1 49.7A98 98 0 0 0 97.8 0C43.9 0 0 43.9 0 97.8s43.9 97.8 97.8 97.8c36.5 0 68.3-20.1 85.1-49.7a97.76 97.76 0 0 0 149.6 25.4l19.4 22.2h3v-87.8h-80l24.3 27.5zM97.8 145c-26 0-47.1-21.1-47.1-47.1s21.1-47.1 47.1-47.1 47.2 21 47.2 47S123.8 145 97.8 145"></path>
+            <svg
+              aria-hidden="true"
+              focusable="false"
+              class="govuk-footer__licence-logo"
+              xmlns="http://www.w3.org/2000/svg"
+              viewBox="0 0 483.2 195.7"
+              height="17"
+              width="41">
+              <path
+                fill="currentColor"
+                d="M421.5 142.8V.1l-50.7 32.3v161.1h112.4v-50.7zm-122.3-9.6A47.12 47.12 0 0 1 221 97.8c0-26 21.1-47.1 47.1-47.1 16.7 0 31.4 8.7 39.7 21.8l42.7-27.2A97.63 97.63 0 0 0 268.1 0c-36.5 0-68.3 20.1-85.1 49.7A98 98 0 0 0 97.8 0C43.9 0 0 43.9 0 97.8s43.9 97.8 97.8 97.8c36.5 0 68.3-20.1 85.1-49.7a97.76 97.76 0 0 0 149.6 25.4l19.4 22.2h3v-87.8h-80l24.3 27.5zM97.8 145c-26 0-47.1-21.1-47.1-47.1s21.1-47.1 47.1-47.1 47.2 21 47.2 47S123.8 145 97.8 145" />
             </svg>
-
-			      <span class="govuk-footer__licence-description">{{{ licenceMessage }}}</span>
+            <span class="govuk-footer__licence-description">
+                {{{ licenceMessage }}}
+            </span>
           </div>
-
           <div class="govuk-footer__meta-item">
-            <a class="govuk-footer__link govuk-footer__copyright-logo" id="copyright-logo" target="_blank" href="https://www.nationalarchives.gov.uk/information-management/re-using-public-sector-information/uk-government-licensing-framework/crown-copyright/">{{{ crownCopyrightMessage }}}</a>
+            <a
+              class="govuk-footer__link govuk-footer__copyright-logo"
+              href="https://www.nationalarchives.gov.uk/information-management/re-using-public-sector-information/uk-government-licensing-framework/crown-copyright/">
+              {{{ crownCopyrightMessage }}}
+            </a>
           </div>
         </div>
       </div>

package/frontend/govuk-template/govuk_template_generated.html

@@ -0,0 +1,118 @@
+
+<!DOCTYPE html>
+<!--[if lt IE 9]><html class="lte-ie8" lang="{{htmlLang}}"><![endif]-->
+<!--[if gt IE 8]><!--><html lang="{{htmlLang}}" class="govuk-template--rebranded"><!--<![endif]-->
+  <head>
+    <meta charset="utf-8" />
+    <title>{{$pageTitle}}{{/pageTitle}}</title>
+    {{$head}}{{/head}}
+
+<meta name="theme-color" content="#1d70b8">
+<meta http-equiv="X-UA-Compatible" content="IE=edge">
+<link rel="icon" sizes="48x48" href="{{govukAssetPath}}rebrand/images/favicon.ico">
+<link rel="icon" sizes="any" href="{{govukAssetPath}}rebrand/images/favicon.svg" type="image/svg+xml">
+<link rel="mask-icon" href="{{govukAssetPath}}rebrand/images/govuk-icon-mask.svg" color="#1d70b8">
+<link rel="apple-touch-icon" href="{{govukAssetPath}}rebrand/images/govuk-icon-180.png">
+<link rel="manifest" href="{{govukAssetPath}}rebrand/manifest.json">
+<meta property="og:image" content="{{govukAssetPath}}rebrand/images/govuk-opengraph-image.png">
+  </head>
+
+  <body class="{{$bodyClasses}}{{/bodyClasses}} govuk-template__body  js-enabled" >
+    <script {{#nonce}}nonce="{{nonce}}"{{/nonce}}>document.body.className += ' js-enabled' + ('noModule' in HTMLScriptElement.prototype ? ' govuk-frontend-supported' : '');</script>
+
+
+    <div id="global-cookie-message" class="gem-c-cookie-banner govuk-clearfix" data-module="cookie-banner" role="region" aria-label="cookie banner" data-nosnippet="">
+       {{$cookieMessage}}{{/cookieMessage}}
+    </div>
+
+	{{$bodyStart}}{{/bodyStart}}
+
+    <header role="banner" id="govuk-header" class="{{$headerClass}}{{/headerClass}}">
+      <div class="govuk-header__container govuk-width-container">
+
+          <div class="govuk-header__logo">
+            <a href="{{$homepageUrl}}https://www.gov.uk{{/homepageUrl}}" title="{{$logoLinkTitle}}Go to the GOV.UK homepage{{/logoLinkTitle}}" id="logo" class="govuk-header__link govuk-header__link--homepage" target="_blank" data-module="track-click" data-track-category="homeLinkClicked" data-track-action="homeHeader">
+                <!--[if gt IE 8]><!-->
+                <div id="govuk-header__logo"></div>
+                <img src="/public/images/govuk-logo.svg" id="govuk-header__logo" alt="Logo" loading="lazy" />
+                  <!--<![endif]-->
+                  <!--[if IE 8]>
+                  <img src="{{govukAssetPath}}rebrand/images/govuk-logotype-tudor-crown.png" class="govuk-header__logotype-crown-fallback-image" width="32" height="30" alt="">
+                  <![endif]-->
+            </a>
+          </div>
+          {{$insideHeader}}{{/insideHeader}}
+
+        {{$propositionHeader}}{{/propositionHeader}}
+      </div>
+    </header>
+
+
+    {{$afterHeader}}{{/afterHeader}}
+
+
+    {{$main}}{{/main}}
+
+    <footer class="govuk-footer">
+      <div class="govuk-width-container">
+        <svg
+          focusable="false"
+          role="presentation"
+          xmlns="http://www.w3.org/2000/svg"
+          viewBox="0 0 64 60"
+          height="30"
+          width="32"
+          fill="currentcolor" class="govuk-footer__crown">
+          <g>
+            <circle cx="20" cy="17.6" r="3.7" />
+            <circle cx="10.2" cy="23.5" r="3.7" />
+            <circle cx="3.7" cy="33.2" r="3.7" />
+            <circle cx="31.7" cy="30.6" r="3.7" />
+            <circle cx="43.3" cy="17.6" r="3.7" />
+            <circle cx="53.2" cy="23.5" r="3.7" />
+            <circle cx="59.7" cy="33.2" r="3.7" />
+            <circle cx="31.7" cy="30.6" r="3.7" />
+            <path d="M33.1,9.8c.2-.1.3-.3.5-.5l4.6,2.4v-6.8l-4.6,1.5c-.1-.2-.3-.3-.5-.5l1.9-5.9h-6.7l1.9,5.9c-.2.1-.3.3-.5.5l-4.6-1.5v6.8l4.6-2.4c.1.2.3.3.5.5l-2.6,8c-.9,2.8,1.2,5.7,4.1,5.7h0c3,0,5.1-2.9,4.1-5.7l-2.6-8ZM37,37.9s-3.4,3.8-4.1,6.1c2.2,0,4.2-.5,6.4-2.8l-.7,8.5c-2-2.8-4.4-4.1-5.7-3.8.1,3.1.5,6.7,5.8,7.2,3.7.3,6.7-1.5,7-3.8.4-2.6-2-4.3-3.7-1.6-1.4-4.5,2.4-6.1,4.9-3.2-1.9-4.5-1.8-7.7,2.4-10.9,3,4,2.6,7.3-1.2,11.1,2.4-1.3,6.2,0,4,4.6-1.2-2.8-3.7-2.2-4.2.2-.3,1.7.7,3.7,3,4.2,1.9.3,4.7-.9,7-5.9-1.3,0-2.4.7-3.9,1.7l2.4-8c.6,2.3,1.4,3.7,2.2,4.5.6-1.6.5-2.8,0-5.3l5,1.8c-2.6,3.6-5.2,8.7-7.3,17.5-7.4-1.1-15.7-1.7-24.5-1.7h0c-8.8,0-17.1.6-24.5,1.7-2.1-8.9-4.7-13.9-7.3-17.5l5-1.8c-.5,2.5-.6,3.7,0,5.3.8-.8,1.6-2.3,2.2-4.5l2.4,8c-1.5-1-2.6-1.7-3.9-1.7,2.3,5,5.2,6.2,7,5.9,2.3-.4,3.3-2.4,3-4.2-.5-2.4-3-3.1-4.2-.2-2.2-4.6,1.6-6,4-4.6-3.7-3.7-4.2-7.1-1.2-11.1,4.2,3.2,4.3,6.4,2.4,10.9,2.5-2.8,6.3-1.3,4.9,3.2-1.8-2.7-4.1-1-3.7,1.6.3,2.3,3.3,4.1,7,3.8,5.4-.5,5.7-4.2,5.8-7.2-1.3-.2-3.7,1-5.7,3.8l-.7-8.5c2.2,2.3,4.2,2.7,6.4,2.8-.7-2.3-4.1-6.1-4.1-6.1h10.6,0Z" />
+          </g>
+        </svg>
+        <div class="govuk-footer__meta">
+          <div class="govuk-footer__meta-item govuk-footer__meta-item--grow">
+            <h2 class="govuk-visually-hidden">Support links</h2>
+            {{$footerSupportLinks}}{{/footerSupportLinks}}
+            <svg
+              aria-hidden="true"
+              focusable="false"
+              class="govuk-footer__licence-logo"
+              xmlns="http://www.w3.org/2000/svg"
+              viewBox="0 0 483.2 195.7"
+              height="17"
+              width="41">
+              <path
+                fill="currentColor"
+                d="M421.5 142.8V.1l-50.7 32.3v161.1h112.4v-50.7zm-122.3-9.6A47.12 47.12 0 0 1 221 97.8c0-26 21.1-47.1 47.1-47.1 16.7 0 31.4 8.7 39.7 21.8l42.7-27.2A97.63 97.63 0 0 0 268.1 0c-36.5 0-68.3 20.1-85.1 49.7A98 98 0 0 0 97.8 0C43.9 0 0 43.9 0 97.8s43.9 97.8 97.8 97.8c36.5 0 68.3-20.1 85.1-49.7a97.76 97.76 0 0 0 149.6 25.4l19.4 22.2h3v-87.8h-80l24.3 27.5zM97.8 145c-26 0-47.1-21.1-47.1-47.1s21.1-47.1 47.1-47.1 47.2 21 47.2 47S123.8 145 97.8 145" />
+            </svg>
+            <span class="govuk-footer__licence-description">
+                {{$licenceMessage}}All content is available under the <a href="https://www.nationalarchives.gov.uk/doc/open-government-licence/version/3/" id="open-government-licence" class="govuk-footer__link" target="_blank" rel="license">Open Government Licence v3.0</a>, except where otherwise stated{{/licenceMessage}}
+            </span>
+          </div>
+          <div class="govuk-footer__meta-item">
+            <a
+              class="govuk-footer__link govuk-footer__copyright-logo"
+              href="https://www.nationalarchives.gov.uk/information-management/re-using-public-sector-information/uk-government-licensing-framework/crown-copyright/">
+              {{$crownCopyrightMessage}}© Crown copyright{{/crownCopyrightMessage}}
+            </a>
+          </div>
+        </div>
+      </div>
+    </footer>
+
+    <div id="global-app-error" class="app-error hidden"></div>
+
+
+    {{$bodyEnd}}{{/bodyEnd}}
+
+
+    <script  {{#nonce}}nonce="{{nonce}}"{{/nonce}}>if (typeof window.GOVUK === 'undefined') document.body.className = document.body.className.replace('js-enabled', '');</script>
+
+  </body>
+</html>