govuk_publishing_components 30.4.0 → 30.5.1

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

@@ -77,13 +77,13 @@
         "name": "navigationLabel",
         "type": "string",
         "required": false,
-        "description": "Text for the `aria-label` attribute of the navigation. Defaults to 'Navigation menu'."
+        "description": "Text for the `aria-label` attribute of the navigation. Defaults to 'Menu'."
     },
     {
         "name": "menuButtonLabel",
         "type": "string",
         "required": false,
-        "description": "Text for the `aria-label` attribute of the button that toggles the navigation. Defaults to 'Show or hide navigation menu'."
+        "description": "Text for the `aria-label` attribute of the button that toggles the navigation. Defaults to 'Show or hide menu'."
     },
     {
         "name": "containerClasses",

data/node_modules/govuk-frontend/govuk/components/header/template.njk

@@ -61,7 +61,7 @@
     {% endif %}
     {% if params.navigation %}
     <nav aria-label="{{ params.navigationLabel | default('Menu') }}" class="govuk-header__navigation {{ params.navigationClasses if params.navigationClasses }}">
-      <button type="button" class="govuk-header__menu-button govuk-js-header-toggle" aria-controls="navigation" aria-label="{{ params.menuButtonLabel | default('Show or hide menu') }}">Menu</button>
+      <button type="button" class="govuk-header__menu-button govuk-js-header-toggle" aria-controls="navigation" aria-label="{{ params.menuButtonLabel | default('Show or hide menu') }}" hidden>Menu</button>
 
       <ul id="navigation" class="govuk-header__navigation-list">
         {% for item in params.navigation %}

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

@@ -60,36 +60,35 @@
     }
   }
 
-  // The ex measurements are based on the number of W's that can fit inside the input
-  // Extra space is left on the right hand side to allow for the Safari prefill icon
-  // Linear regression estimation based on visual tests: y = 1.76 + 1.81x
+  // em measurements are based on the point size of the typeface
+  // Extra space is added on the right hand side to allow for the Safari prefill icon
 
   .govuk-input--width-30 {
-    max-width: 56ex + 3ex;
+    max-width: 29.5em;
   }
 
   .govuk-input--width-20 {
-    max-width: 38ex + 3ex;
+    max-width: 20.5em;
   }
 
   .govuk-input--width-10 {
-    max-width: 20ex + 3ex;
+    max-width: 11.5em;
   }
 
   .govuk-input--width-5 {
-    max-width: 10.8ex;
+    max-width: 5.5em;
   }
 
   .govuk-input--width-4 {
-    max-width: 9ex;
+    max-width: 4.5em;
   }
 
   .govuk-input--width-3 {
-    max-width: 7.2ex;
+    max-width: 3.75em;
   }
 
   .govuk-input--width-2 {
-    max-width: 5.4ex;
+    max-width: 2.75em;
   }
 
   .govuk-input__wrapper {

data/node_modules/govuk-frontend/govuk/components/inset-text/macro-options.json

@@ -11,6 +11,12 @@
         "required": true,
         "description": "If `text` is set, this is not required. HTML to use within the back link component. If `html` is provided, the `text` option will be ignored."
     },
+    {
+        "name": "caller",
+        "type": "nunjucks-block",
+        "required": false,
+        "description": "Not strictly a parameter but [Nunjucks code convention](https://mozilla.github.io/nunjucks/templating.html#call). Using a `call` block enables you to call a macro with all the text inside the tag. This is helpful if you want to pass a lot of content into a macro. To use it, you will need to wrap the entire inset text component in a `call` block."
+    },
     {
         "name": "id",
         "type": "string",

data/node_modules/govuk-frontend/govuk/components/inset-text/template.njk

@@ -1,4 +1,4 @@
 <div {%- if params.id %} id="{{ params.id }}"{% endif %} class="govuk-inset-text {%- if params.classes %} {{ params.classes }}{% endif %}"
 {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>
-  {{ params.html | safe if params.html else params.text }}
+  {{ caller() if caller else (params.html | safe if params.html else params.text) }}
 </div>

data/node_modules/govuk-frontend/govuk/components/notification-banner/macro-options.json

@@ -11,6 +11,12 @@
         "required": true,
         "description": "The HTML to use within the notification banner. You can use any string with this option. If you set `html`, `text` is not required and is ignored."
     },
+    {
+        "name": "caller",
+        "type": "nunjucks-block",
+        "required": false,
+        "description": "Not strictly a parameter but [Nunjucks code convention](https://mozilla.github.io/nunjucks/templating.html#call). Using a `call` block enables you to call a macro with all the text inside the tag. This is helpful if you want to pass a lot of content into a macro. To use it, you will need to wrap the entire notification banner component in a `call` block."
+    },
     {
         "name": "titleText",
         "type": "string",

data/node_modules/govuk-frontend/govuk/components/notification-banner/template.njk

@@ -37,8 +37,8 @@
     </h{{ params.titleHeadingLevel | default(2) }}>
   </div>
   <div class="govuk-notification-banner__content">
-    {%- if params.html -%}
-      {{ params.html | safe }}
+    {%- if caller or params.html -%}
+      {{ caller() if caller else params.html | safe }}
     {%- elif params.text -%}
       {# Set default style for single line content #}
       <p class="govuk-notification-banner__heading">{{ params.text }}</p>

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

@@ -29,6 +29,12 @@
         "required": true,
         "description": "If `text` is set, this is not required. HTML to use within the panel content. If `html` is provided, the `text` option will be ignored."
     },
+    {
+        "name": "caller",
+        "type": "nunjucks-block",
+        "required": false,
+        "description": "Not strictly a parameter but [Nunjucks code convention](https://mozilla.github.io/nunjucks/templating.html#call). Using a `call` block enables you to call a macro with all the text inside the tag. This is helpful if you want to pass a lot of content into a macro. To use it, you will need to wrap the entire panel component in a `call` block."
+    },
     {
         "name": "classes",
         "type": "string",

data/node_modules/govuk-frontend/govuk/components/panel/template.njk

@@ -5,9 +5,9 @@
   <h{{ headingLevel }} class="govuk-panel__title">
     {{ params.titleHtml | safe if params.titleHtml else params.titleText }}
   </h{{ headingLevel }}>
-  {% if params.html or params.text %}
+  {% if caller or params.html or params.text %}
   <div class="govuk-panel__body">
-    {{ params.html | safe if params.html else params.text }}
+    {{ caller() if caller else (params.html | safe if params.html else params.text) }}
   </div>
   {% endif %}
 </div>

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

@@ -7,6 +7,12 @@
     @include govuk-font($size: 19, $line-height: 1.25);
 
     box-sizing: border-box; // should this be global?
+
+    // This min-width was chosen because:
+    // - it makes the Select noticeably wider than it is taller (which is what users expect)
+    // - 11.5em matches the 'length-10' variant of the input component
+    // - it fits comfortably on screens as narrow as 240px wide
+    min-width: 11.5em;
     max-width: 100%;
     height: 40px;
     @if $govuk-typography-use-rem {

data/node_modules/govuk-frontend/govuk/components/select/fixtures.json

@@ -29,6 +29,19 @@
             "html": "<div class=\"govuk-form-group\">\n  <label class=\"govuk-label\" for=\"select-1\">\n    Label text goes here\n  </label>\n\n\n  <select class=\"govuk-select\" id=\"select-1\" name=\"select-1\">\n  \n    \n      <option value=\"1\">GOV.UK frontend option 1</option>\n    \n  \n    \n      <option value=\"2\" selected>GOV.UK frontend option 2</option>\n    \n  \n    \n      <option value=\"3\" disabled>GOV.UK frontend option 3</option>\n    \n  \n  </select>\n</div>",
             "hidden": false
         },
+        {
+            "name": "with no items",
+            "options": {
+                "id": "select-1",
+                "name": "select-1",
+                "label": {
+                    "text": "Horse with no name"
+                },
+                "items": []
+            },
+            "html": "<div class=\"govuk-form-group\">\n  <label class=\"govuk-label\" for=\"select-1\">\n    Horse with no name\n  </label>\n\n\n  <select class=\"govuk-select\" id=\"select-1\" name=\"select-1\">\n  \n  </select>\n</div>",
+            "hidden": false
+        },
         {
             "name": "with selected value",
             "options": {
@@ -357,6 +370,7 @@
             "name": "item selected overrides value",
             "options": {
                 "name": "colors",
+                "id": "colors",
                 "items": [
                     {
                         "value": "red",
@@ -374,7 +388,7 @@
                 ],
                 "value": "green"
             },
-            "html": "<div class=\"govuk-form-group\">\n  \n\n\n  <select class=\"govuk-select\" id=\"\" name=\"colors\">\n  \n    \n      <option value=\"red\">Red</option>\n    \n  \n    \n      <option value=\"green\">Green</option>\n    \n  \n    \n      <option value=\"blue\">Blue</option>\n    \n  \n  </select>\n</div>",
+            "html": "<div class=\"govuk-form-group\">\n  \n\n\n  <select class=\"govuk-select\" id=\"colors\" name=\"colors\">\n  \n    \n      <option value=\"red\">Red</option>\n    \n  \n    \n      <option value=\"green\">Green</option>\n    \n  \n    \n      <option value=\"blue\">Blue</option>\n    \n  \n  </select>\n</div>",
             "hidden": true
         }
     ]

data/node_modules/govuk-frontend/govuk/components/summary-list/_index.scss

@@ -23,6 +23,11 @@
     }
   }
 
+  // Remove right padding from the last column in the row
+  .govuk-summary-list__row:not(.govuk-summary-list__row--no-actions) > :last-child {
+    padding-right: 0;
+  }
+
   // Provide an empty 'cell' for rows that don't have actions – otherwise the
   // bottom border is not drawn for that part of the row in some browsers.
   .govuk-summary-list__row--no-actions {
@@ -52,7 +57,7 @@
     margin-bottom: govuk-spacing(3);
     @include govuk-media-query($from: tablet) {
       width: 20%;
-      padding-right: 0;
+      padding-right: 0; // Needed for IE8
       text-align: right;
     }
   }
@@ -93,21 +98,43 @@
   }
 
   .govuk-summary-list__actions-list-item {
-    display: inline;
-    margin-right: govuk-spacing(2);
-    padding-right: govuk-spacing(2);
+    display: inline-block;
   }
 
   // In older browsers such as IE8, :last-child is not available,
   // so only show the border divider where it is available.
-  .govuk-summary-list__actions-list-item:not(:last-child) {
-    border-right: 1px solid $govuk-border-colour;
+  @include govuk-media-query($until: tablet) {
+    .govuk-summary-list__actions-list-item {
+      margin-right: govuk-spacing(2);
+      padding-right: govuk-spacing(2);
+    }
+
+    .govuk-summary-list__actions-list-item:not(:last-child) {
+      border-right: 1px solid $govuk-border-colour;
+    }
+
+    .govuk-summary-list__actions-list-item:last-child {
+      margin-right: 0;
+      padding-right: 0;
+      border: 0;
+    }
   }
 
-  .govuk-summary-list__actions-list-item:last-child {
-    margin-right: 0;
-    padding-right: 0;
-    border: 0;
+  @include govuk-media-query($from: tablet) {
+    .govuk-summary-list__actions-list-item {
+      margin-left: govuk-spacing(2);
+      padding-left: govuk-spacing(2);
+    }
+
+    .govuk-summary-list__actions-list-item:not(:first-child) {
+      border-left: 1px solid $govuk-border-colour;
+    }
+
+    .govuk-summary-list__actions-list-item:first-child {
+      margin-left: 0;
+      padding-left: 0;
+      border: 0;
+    }
   }
 
   // No border on entire summary list

data/node_modules/govuk-frontend/govuk/components/summary-list/fixtures.json

@@ -101,7 +101,72 @@
                     }
                 ]
             },
-            "html": "<dl class=\"govuk-summary-list\">\n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Name\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          Firstname Lastname\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <ul class=\"govuk-summary-list__actions-list\">\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Edit<span class=\"govuk-visually-hidden\"> name</span>\n                      </a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Delete<span class=\"govuk-visually-hidden\"> name</span>\n                      </a>\n                  </li>\n                \n              </ul>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Date of birth\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          13/08/1980\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <a class=\"govuk-link\" href=\"#\">\n                Change<span class=\"govuk-visually-hidden\"> date of birth</span>\n                </a>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Contact information\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <p class=\"govuk-body\">\n         email@email.com\n        </p>\n        <p class=\"govuk-body\">\n          Address line 1<br>\n          Address line 2<br>\n          Address line 3<br>\n          Address line 4<br>\n          Address line 5\n        </p>\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <ul class=\"govuk-summary-list__actions-list\">\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Edit<span class=\"govuk-visually-hidden\"> contact information</span>\n                      </a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Change<span class=\"govuk-visually-hidden\"> contact information</span>\n                      </a>\n                  </li>\n                \n              </ul>\n            \n          </dd>\n        \n      </div>\n    \n  \n</dl>",
+            "html": "<dl class=\"govuk-summary-list\">\n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Name\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          Firstname Lastname\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <ul class=\"govuk-summary-list__actions-list\"><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Edit<span class=\"govuk-visually-hidden\"> name</span>\n                      </a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Delete<span class=\"govuk-visually-hidden\"> name</span>\n                      </a></li></ul>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Date of birth\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          13/08/1980\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <a class=\"govuk-link\" href=\"#\">\n                Change<span class=\"govuk-visually-hidden\"> date of birth</span>\n                </a>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Contact information\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <p class=\"govuk-body\">\n         email@email.com\n        </p>\n        <p class=\"govuk-body\">\n          Address line 1<br>\n          Address line 2<br>\n          Address line 3<br>\n          Address line 4<br>\n          Address line 5\n        </p>\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <ul class=\"govuk-summary-list__actions-list\"><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Edit<span class=\"govuk-visually-hidden\"> contact information</span>\n                      </a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Change<span class=\"govuk-visually-hidden\"> contact information</span>\n                      </a></li></ul>\n            \n          </dd>\n        \n      </div>\n    \n  \n</dl>",
+            "hidden": false
+        },
+        {
+            "name": "translated",
+            "options": {
+                "rows": [
+                    {
+                        "key": {
+                            "text": "Enw"
+                        },
+                        "value": {
+                            "text": "Firstname Lastname"
+                        },
+                        "actions": {
+                            "items": [
+                                {
+                                    "href": "#",
+                                    "html": "Golygu<span class=\"govuk-visually-hidden\"> enw</span>",
+                                    "visuallyHiddenText": false
+                                },
+                                {
+                                    "href": "#",
+                                    "html": "Dileu<span class=\"govuk-visually-hidden\"> enw</span>",
+                                    "visuallyHiddenText": false
+                                }
+                            ]
+                        }
+                    },
+                    {
+                        "key": {
+                            "text": "Dyddiad geni"
+                        },
+                        "value": {
+                            "text": "13/08/1980"
+                        },
+                        "actions": {
+                            "items": [
+                                {
+                                    "href": "#",
+                                    "html": "Golygu<span class=\"govuk-visually-hidden\"> dyddiad geni</span>",
+                                    "visuallyHiddenText": false
+                                }
+                            ]
+                        }
+                    },
+                    {
+                        "key": {
+                            "text": "Gwybodaeth cyswllt"
+                        },
+                        "value": {
+                            "html": "<p class=\"govuk-body\">\n email@email.com\n</p>\n<p class=\"govuk-body\">\n  Address line 1<br>\n  Address line 2<br>\n  Address line 3<br>\n  Address line 4<br>\n  Address line 5\n</p>\n"
+                        },
+                        "actions": {
+                            "items": [
+                                {
+                                    "href": "#",
+                                    "html": "Golygu<span class=\"govuk-visually-hidden\"> gwybodaeth cyswllt</span>",
+                                    "visuallyHiddenText": false
+                                }
+                            ]
+                        }
+                    }
+                ]
+            },
+            "html": "<dl class=\"govuk-summary-list\">\n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Enw\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          Firstname Lastname\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <ul class=\"govuk-summary-list__actions-list\"><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Golygu<span class=\"govuk-visually-hidden\"> enw</span></a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Dileu<span class=\"govuk-visually-hidden\"> enw</span></a></li></ul>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Dyddiad geni\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          13/08/1980\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <a class=\"govuk-link\" href=\"#\">\n                Golygu<span class=\"govuk-visually-hidden\"> dyddiad geni</span></a>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Gwybodaeth cyswllt\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <p class=\"govuk-body\">\n         email@email.com\n        </p>\n        <p class=\"govuk-body\">\n          Address line 1<br>\n          Address line 2<br>\n          Address line 3<br>\n          Address line 4<br>\n          Address line 5\n        </p>\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <a class=\"govuk-link\" href=\"#\">\n                Golygu<span class=\"govuk-visually-hidden\"> gwybodaeth cyswllt</span></a>\n            \n          </dd>\n        \n      </div>\n    \n  \n</dl>",
             "hidden": false
         },
         {
@@ -148,7 +213,7 @@
                     }
                 ]
             },
-            "html": "<dl class=\"govuk-summary-list\">\n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Name\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          Firstname Lastname\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <ul class=\"govuk-summary-list__actions-list\">\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Edit<span class=\"govuk-visually-hidden\"> name</span>\n                      </a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Delete<span class=\"govuk-visually-hidden\"> name</span>\n                      </a>\n                  </li>\n                \n              </ul>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row govuk-summary-list__row--no-actions\">\n        <dt class=\"govuk-summary-list__key\">\n          Date of birth\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          13/08/1980\n        </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row govuk-summary-list__row--no-actions\">\n        <dt class=\"govuk-summary-list__key\">\n          Contact information\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <p class=\"govuk-body\">\n          email@email.com\n        </p>\n        <p class=\"govuk-body\">\n          Address line 1<br>\n          Address line 2<br>\n          Address line 3<br>\n          Address line 4<br>\n          Address line 5\n        </p>\n        </dd>\n        \n      </div>\n    \n  \n</dl>",
+            "html": "<dl class=\"govuk-summary-list\">\n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Name\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          Firstname Lastname\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <ul class=\"govuk-summary-list__actions-list\"><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Edit<span class=\"govuk-visually-hidden\"> name</span>\n                      </a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Delete<span class=\"govuk-visually-hidden\"> name</span>\n                      </a></li></ul>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row govuk-summary-list__row--no-actions\">\n        <dt class=\"govuk-summary-list__key\">\n          Date of birth\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          13/08/1980\n        </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row govuk-summary-list__row--no-actions\">\n        <dt class=\"govuk-summary-list__key\">\n          Contact information\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <p class=\"govuk-body\">\n          email@email.com\n        </p>\n        <p class=\"govuk-body\">\n          Address line 1<br>\n          Address line 2<br>\n          Address line 3<br>\n          Address line 4<br>\n          Address line 5\n        </p>\n        </dd>\n        \n      </div>\n    \n  \n</dl>",
             "hidden": false
         },
         {
@@ -374,7 +439,7 @@
                     }
                 ]
             },
-            "html": "<dl class=\"govuk-summary-list\">\n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key govuk-!-width-one-half\">\n          Name\n        </dt>\n        <dd class=\"govuk-summary-list__value govuk-!-width-one-quarter\">\n          Firstname Lastname\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions govuk-!-width-one-half\">\n            \n              <ul class=\"govuk-summary-list__actions-list\">\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Edit<span class=\"govuk-visually-hidden\"> name</span>\n                      </a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Delete<span class=\"govuk-visually-hidden\"> name</span>\n                      </a>\n                  </li>\n                \n              </ul>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Date of birth\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          13/08/1980\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <a class=\"govuk-link\" href=\"#\">\n                Change<span class=\"govuk-visually-hidden\"> date of birth</span>\n                </a>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Contact information\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <p class=\"govuk-body\">\n          email@email.com\n        </p>\n        <p class=\"govuk-body\">\n          Address line 1<br>\n          Address line 2<br>\n          Address line 3<br>\n          Address line 4<br>\n          Address line 5\n        </p>\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <ul class=\"govuk-summary-list__actions-list\">\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Edit<span class=\"govuk-visually-hidden\"> contact information</span>\n                      </a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Change<span class=\"govuk-visually-hidden\"> contact information</span>\n                      </a>\n                  </li>\n                \n              </ul>\n            \n          </dd>\n        \n      </div>\n    \n  \n</dl>",
+            "html": "<dl class=\"govuk-summary-list\">\n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key govuk-!-width-one-half\">\n          Name\n        </dt>\n        <dd class=\"govuk-summary-list__value govuk-!-width-one-quarter\">\n          Firstname Lastname\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions govuk-!-width-one-half\">\n            \n              <ul class=\"govuk-summary-list__actions-list\"><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Edit<span class=\"govuk-visually-hidden\"> name</span>\n                      </a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Delete<span class=\"govuk-visually-hidden\"> name</span>\n                      </a></li></ul>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Date of birth\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          13/08/1980\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <a class=\"govuk-link\" href=\"#\">\n                Change<span class=\"govuk-visually-hidden\"> date of birth</span>\n                </a>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Contact information\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <p class=\"govuk-body\">\n          email@email.com\n        </p>\n        <p class=\"govuk-body\">\n          Address line 1<br>\n          Address line 2<br>\n          Address line 3<br>\n          Address line 4<br>\n          Address line 5\n        </p>\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <ul class=\"govuk-summary-list__actions-list\"><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Edit<span class=\"govuk-visually-hidden\"> contact information</span>\n                      </a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Change<span class=\"govuk-visually-hidden\"> contact information</span>\n                      </a></li></ul>\n            \n          </dd>\n        \n      </div>\n    \n  \n</dl>",
             "hidden": false
         },
         {
@@ -867,7 +932,7 @@
                     }
                 ]
             },
-            "html": "<dl class=\"govuk-summary-list\">\n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Name\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          Barnaby Marmaduke Aloysius Benjy Cobweb Dartagnan Egbert Felix Gaspar Humbert Ignatius Jayden Kasper Leroy Maximilian Neddy Obiajulu Pepin Quilliam Rosencrantz Sexton Teddy Upwood Vivatma Wayland Xylon Yardley Zachary Usansky\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <ul class=\"govuk-summary-list__actions-list\">\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Buy</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Use</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Break</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Fix</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Trash</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Change</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Mail</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Upgrade</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Charge</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Point</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Zoom</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Press</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Snap</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Work</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Quick</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Erase</a>\n                  </li>\n                \n              </ul>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Long website address\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <a class=\"govuk-link\" href=\"https://cs.wikipedia.org/wiki/Llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch\">https://cs.wikipedia.org/wiki/Llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch</a>\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <a class=\"govuk-link\" href=\"#\">\n                Change<span class=\"govuk-visually-hidden\"> long website address</span>\n                </a>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Long email address\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <a class=\"govuk-link\" href=\"mailto:webmaster@llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch.com\">webmaster@llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch.com</a>\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <a class=\"govuk-link\" href=\"#\">\n                Change<span class=\"govuk-visually-hidden\"> long email address</span>\n                </a>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          No wrapping allowed\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <p class=\"govuk-body\" style=\"white-space: nowrap;\">michelle.longish.name@example.com</p>\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <a class=\"govuk-link\" href=\"#\">\n                Change<span class=\"govuk-visually-hidden\"> no wrapping allowed</span>\n                </a>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Pneumonoultramicroscopicsilicovolcanoconiosis\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <p class=\"govuk-body\">Pneumonoultramicroscopicsilicovolcanoconiosis is a word coined by the president of the National Puzzlers’ League as a synonym for the disease known as silicosis. It is the longest word in the English language published in a dictionary, the Oxford English Dictionary, which defines it as \"an artificial long word said to mean a lung disease caused by inhaling very fine ash and sand dust.\"</p>\n        <p class=\"govuk-body\">Silicosis is a form of occupational lung disease caused by inhalation of crystalline silica dust, and is marked by inflammation and scarring in the form of nodular lesions in the upper lobes of the lungs. It is a type of pneumoconiosis.</p>\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <ul class=\"govuk-summary-list__actions-list\">\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Write</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Cut</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Paste</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Save</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Load</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Check</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Quick</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Rewrite</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Plug</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Play</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Burn</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Rip</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Drag and drop</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Zip</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Unzip</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Lock</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Fill</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Curl</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Find</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      View</a>\n                  </li>\n                \n              </ul>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Its vanished trees, the trees that had made way for Gatsby’s house, Pneumonoultramicroscopicsilicovolcanoconiosis had once pandered in whispers to the last and greatest of all human dreams; for a transitory enchanted moment man must have held his breath in the presence of this continent, compelled into an aesthetic contemplation he neither understood nor desired, face to face for the last time in history with something commensurate to his capacity for wonder.\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          The Great Gatsby\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <ul class=\"govuk-summary-list__actions-list\">\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Code</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Jam</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Unlock</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Surf</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Scroll</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Pose</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Click</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Cross</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Crack</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Twitch</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Update</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Name</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Read</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Tune</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Print</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Scan</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Send</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Fax</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Rename</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Touch</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Bring</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Pay</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Watch</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Turn</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Leave</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Stop</a>\n                  </li>\n                \n                  <li class=\"govuk-summary-list__actions-list-item\">\n                    <a class=\"govuk-link\" href=\"#\">\n                      Format</a>\n                  </li>\n                \n              </ul>\n            \n          </dd>\n        \n      </div>\n    \n  \n</dl>",
+            "html": "<dl class=\"govuk-summary-list\">\n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Name\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          Barnaby Marmaduke Aloysius Benjy Cobweb Dartagnan Egbert Felix Gaspar Humbert Ignatius Jayden Kasper Leroy Maximilian Neddy Obiajulu Pepin Quilliam Rosencrantz Sexton Teddy Upwood Vivatma Wayland Xylon Yardley Zachary Usansky\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <ul class=\"govuk-summary-list__actions-list\"><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Buy</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Use</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Break</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Fix</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Trash</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Change</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Mail</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Upgrade</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Charge</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Point</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Zoom</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Press</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Snap</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Work</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Quick</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Erase</a></li></ul>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Long website address\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <a class=\"govuk-link\" href=\"https://cs.wikipedia.org/wiki/Llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch\">https://cs.wikipedia.org/wiki/Llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch</a>\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <a class=\"govuk-link\" href=\"#\">\n                Change<span class=\"govuk-visually-hidden\"> long website address</span>\n                </a>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Long email address\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <a class=\"govuk-link\" href=\"mailto:webmaster@llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch.com\">webmaster@llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch.com</a>\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <a class=\"govuk-link\" href=\"#\">\n                Change<span class=\"govuk-visually-hidden\"> long email address</span>\n                </a>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          No wrapping allowed\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <p class=\"govuk-body\" style=\"white-space: nowrap;\">michelle.longish.name@example.com</p>\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <a class=\"govuk-link\" href=\"#\">\n                Change<span class=\"govuk-visually-hidden\"> no wrapping allowed</span>\n                </a>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Pneumonoultramicroscopicsilicovolcanoconiosis\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          <p class=\"govuk-body\">Pneumonoultramicroscopicsilicovolcanoconiosis is a word coined by the president of the National Puzzlers’ League as a synonym for the disease known as silicosis. It is the longest word in the English language published in a dictionary, the Oxford English Dictionary, which defines it as \"an artificial long word said to mean a lung disease caused by inhaling very fine ash and sand dust.\"</p>\n        <p class=\"govuk-body\">Silicosis is a form of occupational lung disease caused by inhalation of crystalline silica dust, and is marked by inflammation and scarring in the form of nodular lesions in the upper lobes of the lungs. It is a type of pneumoconiosis.</p>\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <ul class=\"govuk-summary-list__actions-list\"><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Write</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Cut</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Paste</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Save</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Load</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Check</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Quick</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Rewrite</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Plug</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Play</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Burn</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Rip</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Drag and drop</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Zip</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Unzip</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Lock</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Fill</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Curl</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Find</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      View</a></li></ul>\n            \n          </dd>\n        \n      </div>\n    \n  \n    \n      <div class=\"govuk-summary-list__row\">\n        <dt class=\"govuk-summary-list__key\">\n          Its vanished trees, the trees that had made way for Gatsby’s house, Pneumonoultramicroscopicsilicovolcanoconiosis had once pandered in whispers to the last and greatest of all human dreams; for a transitory enchanted moment man must have held his breath in the presence of this continent, compelled into an aesthetic contemplation he neither understood nor desired, face to face for the last time in history with something commensurate to his capacity for wonder.\n        </dt>\n        <dd class=\"govuk-summary-list__value\">\n          The Great Gatsby\n        </dd>\n        \n          <dd class=\"govuk-summary-list__actions\">\n            \n              <ul class=\"govuk-summary-list__actions-list\"><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Code</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Jam</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Unlock</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Surf</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Scroll</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Pose</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Click</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Cross</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Crack</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Twitch</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Update</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Name</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Read</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Tune</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Print</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Scan</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Send</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Fax</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Rename</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Touch</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Bring</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Pay</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Watch</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Turn</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Leave</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Stop</a></li><li class=\"govuk-summary-list__actions-list-item\"><a class=\"govuk-link\" href=\"#\">\n                      Format</a></li></ul>\n            \n          </dd>\n        \n      </div>\n    \n  \n</dl>",
             "hidden": false
         },
         {

data/node_modules/govuk-frontend/govuk/components/summary-list/template.njk

@@ -29,11 +29,11 @@
               {{ _actionLink(row.actions.items[0]) | indent(12) | trim }}
             {% else %}
               <ul class="govuk-summary-list__actions-list">
-                {% for action in row.actions.items %}
+                {%- for action in row.actions.items -%}
                   <li class="govuk-summary-list__actions-list-item">
-                    {{ _actionLink(action) | indent(18) | trim }}
+                    {{- _actionLink(action) | indent(18) | trim -}}
                   </li>
-                {% endfor %}
+                {%- endfor -%}
               </ul>
             {% endif %}
           </dd>