Release v5.2.0

[owenatgov]

5.2.0 (feature release)

In this release, we’ve adjusted our responsive type scale, which is available behind a feature flag. The type scale change is to make text easier to read on smaller screens. We’ve also deprecated the useTudorCrown parameter.

To install this version with npm, run npm install govuk-frontend@5.2.0. You can also find more information about how to stay up to date in our documentation.

New features

We've adjusted our responsive type scale

We've made the following adjustments to our responsive type scale:

• point 16 now returns 16px across all screen sizes
• point 19 now returns 19px across all screen sizes
• point 24 remains as 24px on large screens
• point 24 now returns 21px on small screens instead of 18px and has a line height 25px instead of 20px
• point 27 remains as 27px on large screens
• point 27 now returns 21px on small screens instead of 18px and has a line height 25px instead of 20px
• point 36 remains as 27px on large screens
• point 36 now returns 27px on small screens instead of 24px and has a line height 30px instead of 25px

To enable these changes, set the feature flag variable $govuk-new-typography-scale to true before you import GOV.UK Frontend in your Sass files:

// application.scss
$govuk-new-typography-scale: true;
@import "govuk-frontend/all";

If your service uses custom elements made using GOV.UK Frontend, test your service against the new typography scale to assess if you need to make any adjustments.

You can read more on upgrading your service to the new type scale in our upgrade guide.

This change was introduced in pull request #2421: Adjust the responsive type scale

Insert custom HTML into component form group wrappers

You can now insert custom HTML into form group wrappers for all components with form fields.

govukInput({
  formGroup: {
    beforeInput: {
      html: "example"
    },
    afterInput: {
      html: "example"
    },
  }
})

This change was introduced in pull request #4567: Add beforeInput(s) and beforeInput(s) options to form groups.

Deprecated features

Stop using the useTudorCrown parameter in the Heading component

The rollout for the revised GOV.UK logo has started and the Tudor crown logo is now shown by default. We’ve deprecated the useTudorCrown parameter and will remove it in the next major release.

You can now remove the useTudorCrown parameter, along with any other adjustments made to display the Tudor crown logo in your service.

This change was introduced in pull request #4740: Make Tudor Crown logo the default

Fixes

We've made fixes to GOV.UK Frontend in the following pull requests:

• #4768: Fix z-index of inputs in Radios and Checkboxes component
• #4784: Fix LibSass calc() compatibility in Radios and Checkboxes

[github-actions]

JavaScript changes to GitHub release

diff --git a/dist/govuk-frontend-5.1.0.min.js b/dist/govuk-frontend-5.2.0.min.js
index f4274f5bd..a6cf3ebc2 100644
--- a/dist/govuk-frontend-5.1.0.min.js
+++ b/dist/govuk-frontend-5.2.0.min.js
@@ -1,4 +1,4 @@
-const version = "5.1.0";
+const version = "5.2.0";
 
 function mergeConfigs(...t) {
     function flattenObject(t) {
@@ -1013,4 +1013,4 @@ export {
     Tabs,
     initAll,
     version
-}; //# sourceMappingURL=govuk-frontend-5.1.0.min.js.map
\ No newline at end of file
+}; //# sourceMappingURL=govuk-frontend-5.2.0.min.js.map
\ No newline at end of file

---

Action run for ac860ed

[github-actions]

Stylesheets changes to GitHub release

diff --git a/dist/govuk-frontend-5.1.0.min.css b/dist/govuk-frontend-5.2.0.min.css
index 1719cc124..8cc48decc 100644
--- a/dist/govuk-frontend-5.1.0.min.css
+++ b/dist/govuk-frontend-5.2.0.min.css
@@ -1,7 +1,7 @@
 @charset "UTF-8";
 
 :root {
-    --govuk-frontend-version: "5.1.0";
+    --govuk-frontend-version: "5.2.0";
     --govuk-frontend-breakpoint-mobile: 20rem;
     --govuk-frontend-breakpoint-tablet: 40.0625rem;
     --govuk-frontend-breakpoint-desktop: 48.0625rem
@@ -2476,6 +2476,7 @@
 }
 
 .govuk-checkboxes__input {
+    z-index: 1;
     width: 44px;
     height: 44px;
     margin: 0;
@@ -4815,6 +4816,7 @@ only screen and (min-resolution:2dppx) {
 }
 
 .govuk-radios__input {
+    z-index: 1;
     width: 44px;
     height: 44px;
     margin: 0;
@@ -7600,4 +7602,4 @@ screen and (-ms-high-contrast:active) {
     }
 }
 
-/*# sourceMappingURL=govuk-frontend-5.1.0.min.css.map */
\ No newline at end of file
+/*# sourceMappingURL=govuk-frontend-5.2.0.min.css.map */
\ No newline at end of file

---

Action run for ac860ed

[github-actions]

Other changes to GitHub release

diff --git a/dist/VERSION.txt b/dist/VERSION.txt
index 831446cbd..91ff57278 100644
--- a/dist/VERSION.txt
+++ b/dist/VERSION.txt
@@ -1 +1 @@
-5.1.0
+5.2.0

---

Action run for ac860ed

[domoscargin]

🚀

[github-actions]

📋 Stats

File sizes

File	Size
dist/govuk-frontend-development.min.css	112.47 KiB
dist/govuk-frontend-development.min.js	38.58 KiB
packages/govuk-frontend/dist/govuk/all.bundle.js	78.74 KiB
packages/govuk-frontend/dist/govuk/all.bundle.mjs	73.99 KiB
packages/govuk-frontend/dist/govuk/all.mjs	3.86 KiB
packages/govuk-frontend/dist/govuk/govuk-frontend-component.mjs	359 B
packages/govuk-frontend/dist/govuk/govuk-frontend.min.css	112.46 KiB
packages/govuk-frontend/dist/govuk/govuk-frontend.min.js	38.57 KiB
packages/govuk-frontend/dist/govuk/i18n.mjs	5.38 KiB

Modules

File	Size
all.mjs	70.32 KiB
components/accordion/accordion.mjs	21.67 KiB
components/button/button.mjs	4.7 KiB
components/character-count/character-count.mjs	21.24 KiB
components/checkboxes/checkboxes.mjs	5.83 KiB
components/error-summary/error-summary.mjs	6.57 KiB
components/exit-this-page/exit-this-page.mjs	16.08 KiB
components/header/header.mjs	4.46 KiB
components/notification-banner/notification-banner.mjs	4.93 KiB
components/radios/radios.mjs	4.83 KiB
components/skip-link/skip-link.mjs	4.39 KiB
components/tabs/tabs.mjs	10.16 KiB

View stats and visualisations on the review app

---

Action run for ac860ed