Add explicit width to summary list row with 'no actions' pseudo-element

CHANGELOG.md

@@ -15,6 +15,7 @@ This change was introduced in [#2491: Prevent error summary from being re-focuse
 - [#2475: Tweak whitespace in input component HTML for improved readability](https://github.com/alphagov/govuk-frontend/pull/2475)
 - [#2491: Prevent error summary from being re-focused after it has been initially focused on page load](https://github.com/alphagov/govuk-frontend/pull/2491)
 - [#2494: Allow disabling autofocus on error summary](https://github.com/alphagov/govuk-frontend/pull/2494)
+- [#2515: Add explicit width to summary list row with no actions pseudoelement](https://github.com/alphagov/govuk-frontend/pull/2515)
 
 ## 4.0.0 (Breaking release)
 

src/govuk/components/summary-list/_index.scss

@@ -25,9 +25,14 @@
 
   // 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:after {
-    content: "";
-    display: table-cell;
+  .govuk-summary-list__row--no-actions {
+    @include govuk-media-query($from: tablet) {
+      &:after {
+        content: "";
+        display: table-cell;
+        width: 20%;
+      }
+    }
   }
 
   .govuk-summary-list__key,

src/govuk/components/summary-list/summary-list.yaml

@@ -178,6 +178,56 @@ examples:
                 Address line 4<br>
                 Address line 5
               </p>
+  - name: with no first action
+    data:
+      rows:
+        - key:
+            text: Name
+          value:
+            text: Sarah Philips
+        - key:
+            text: Date of birth
+          value:
+            text: 5 January 1978
+          actions:
+            items:
+            - href: '#'
+              text: Change
+              visuallyHiddenText: date of birth
+        - key:
+            text: Address
+          value:
+            html: |
+              72 Guild Street<br>
+              London<br>
+              SE23 6FH
+          actions:
+            items:
+              - href: '#'
+                text: Change
+                visuallyHiddenText: address
+        - key:
+            text: Contact details
+          value:
+            html: |
+              07700 900457<br>
+              sarah.phillips@example.com
+          actions:
+            items:
+              - href: '#'
+                text: Change
+                visuallyHiddenText: contact details
+        - key:
+            text: Licence period
+          value:
+            html: |
+              <p class="govuk-body">This is a longer paragraph of text provided by the user to provide additional information.</p>
+              <p class="govuk-body">This is a second paragraph of text provided by the user.</p>
+          actions:
+            items:
+              - href: '#'
+                text: Change
+                visuallyHiddenText: licence period
   - name: no-border
     data:
       classes: govuk-summary-list--no-border