govuk-frontend
Advanced tools
Changelog
3.13.1 (Fix release)
We’ve made fixes to GOV.UK Frontend in the following pull requests:
max-width
to file upload componentpadding-right
from details componentChangelog
3.13.0 (Feature release)
You can now add a 'none' option to checkboxes. For example, 'None of the above' or 'None of these options apply to me'.
Use the 'none' option to allow users to state that none of the checkboxes apply to them. Otherwise, users would have to work out that they should leave all the checkboxes unticked.
You can now also add an 'or' divider before the 'none' option. Use the 'or' divider to make the 'none' option more visible to users.
This was added in pull request #2151: Add 'None of the above' and 'or' divider to checkboxes. Thanks to @frankieroberto for contributing this improvement.
nonce
attribute to inline scriptsIf your service has a Content Security Policy (CSP), you can now add a nonce
attribute to inline scripts within the Nunjucks page template. To do this, set the cspNonce
Nunjucks variable. However, you should only add this attribute if you're not able to include the hash for the inline scripts in your CSP.
Make sure you understand the security implications of using this attribute, as wrong implementation could affect your service’s security.
Read more about how to configure your CSP to work with GOV.UK Frontend.
This was added in pull request #2245: Allow the CSP nonce
attribute to be set on the inline script in the page template. Thanks to @natcarey for contributing this issue and its solution.
We've made the following fixes in pull request #2229: Change approach to fallback PNG in the header to fix blank data URI from triggering Content Security Policy error:
We’ve also made fixes in the following pull requests:
Changelog
3.12.0 (Feature release)
Links now have underlines that are consistently thinner and a bit further away from the link text.
Links also have a clearer hover state, where the underline gets thicker to make the link stand out to users.
These changes are an opt-in feature because you may:
To enable this feature, set $govuk-new-link-styles
to true
before you import GOV.UK Frontend in your Sass:
// application.scss
$govuk-new-link-styles: true;
@import "govuk-frontend/all";
If you have created your own link styles, you should review them to ensure their use is consistent across your service.
To make it easier to be consistent in your use of link styles, we’ve also introduced new mixins and modifier classes for:
These new link styles will be enabled by default in a future major version of GOV.UK Frontend.
This was added in pull request #2183: Updates to link styles and link hover states.
You can now remove underlines from links by using either the:
govuk-link-style-no-underline
mixin in your Sass, orgovuk-link--no-underline
class in your HTMLAn underline still appears when the user hovers their cursor over the link.
This was added in pull request #2214: Add no-underline mixin and modifier class.
You can now style links on dark backgrounds to use white text colour by using either the:
govuk-link-style-inverse
mixin in your Sass, orgovuk-link--inverse
class in your HTMLThis was added in pull request #2213: Add inverse link mixin and modifier class.
You can now add links styled as buttons to cookie banners. For example, you can set the Hide button to be a link styled as a button that reloads the page. Use this feature if you set non-essential cookies on the server and want to help users keep their place using progressive enhancement.
This feature is enabled by default.
This was added in pull request #2164: Enable cookie banner to set link styled as a button.
Changelog
3.11.0 (Feature release)
You can now use cookie banners to allow users to accept or reject cookies which are not essential for making your service work.
This was added in pull request #2131: Add cookie banner component and button groups.
You can now use a button group when you place two or more buttons together.
Any links you include within a button group now line up visually with the buttons.
Read more about button groups on the Design System’s button page.
This was added in pull request #2114: Add button groups for use in cookie banner.
You can now make table captions larger or smaller by applying the govuk-table__caption--xl
, govuk-table__caption--l
, govuk-table__caption--m
or govuk-table__caption--s
classes.
This was added in pull request #2048: Add modifiers for table captions.
We’ve made fixes to GOV.UK Frontend in the following pull requests:
Changelog
3.10.2 (Patch release)
We’ve made fixes to the fixtures you can use to check your HTML matches GOV.UK Frontend.
These changes were made in the following pull requests:
There are no other changes to GOV.UK Frontend in this release.
Changelog
3.10.1 (Patch release)
We’ve made fixes to GOV.UK Frontend in the following pull requests:
Changelog
3.10.0 (Feature release)
You can now use notification banners to tell users about events that occur elsewhere in your service. For example, when they need to complete tasks.
This was added in pull request #1935: Create notification banner component.
You can now change which keyboard type displays for mobile and tablet users. This enables users to enter characters other than numbers when they use the date input. To change the keyboard type, set the inputmode
when you use the Nunjucks macro options.
This was added in pull request #1975: Enable custom inputmode for date input component. Thanks to @foaly-nr1 for contributing this issue.
Changelog
3.9.1 (Fix release)
We’ve made fixes to GOV.UK Frontend in the following pull requests:
Changelog
3.9.0 (Feature release)
You can now use prefixes and suffixes in the text input component to help users enter things like currencies and measurements.
This was added in pull request #1816: Add input prefix and suffix. Thanks to @simonwhatley and the GOV.UK Coronavirus Services Team.
Changelog
3.8.1 (Fix release)
We’ve made fixes to GOV.UK Frontend in the following pull requests: