Release v5.6.0 #5274
Merged
Release v5.6.0 #5274
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
govuk-design-system-ci
temporarily deployed
to
govuk-frontend-pr-5274
JavaScript changes to GitHub releasediff --git a/dist/govuk-frontend-5.5.0.min.js b/dist/govuk-frontend-5.6.0.min.js
index 894c56aa3..d3dafdc1d 100644
--- a/dist/govuk-frontend-5.5.0.min.js
+++ b/dist/govuk-frontend-5.6.0.min.js
@@ -1,4 +1,4 @@
-const version = "5.5.0";
+const version = "5.6.0";
function normaliseString(e, t) {
const n = e ? e.trim() : "";
@@ -899,6 +899,45 @@ class Radios extends GOVUKFrontendComponent {
}
}
Radios.moduleName = "govuk-radios";
+class ServiceNavigation extends GOVUKFrontendComponent {
+ constructor(e) {
+ if (super(), this.$module = void 0, this.$menuButton = void 0, this.$menu = void 0, this.menuIsOpen = !1, this.mql = null, !e) throw new ElementError({
+ componentName: "Service Navigation",
+ element: e,
+ identifier: "Root element (`$module`)"
+ });
+ this.$module = e;
+ const t = e.querySelector(".govuk-js-service-navigation-toggle");
+ if (!t) return this;
+ const n = t.getAttribute("aria-controls");
+ if (!n) throw new ElementError({
+ componentName: "Service Navigation",
+ identifier: 'Navigation button (`<button class="govuk-js-service-navigation-toggle">`) attribute (`aria-controls`)'
+ });
+ const i = document.getElementById(n);
+ if (!i) throw new ElementError({
+ componentName: "Service Navigation",
+ element: i,
+ identifier: `Navigation (\`<ul id="${n}">\`)`
+ });
+ this.$menu = i, this.$menuButton = t, this.setupResponsiveChecks(), this.$menuButton.addEventListener("click", (() => this.handleMenuButtonClick()))
+ }
+ setupResponsiveChecks() {
+ const e = getBreakpoint("tablet");
+ if (!e.value) throw new ElementError({
+ componentName: "Service Navigation",
+ identifier: `CSS custom property (\`${e.property}\`) on pseudo-class \`:root\``
+ });
+ this.mql = window.matchMedia(`(min-width: ${e.value})`), "addEventListener" in this.mql ? this.mql.addEventListener("change", (() => this.checkMode())) : this.mql.addListener((() => this.checkMode())), this.checkMode()
+ }
+ checkMode() {
+ this.mql && this.$menu && this.$menuButton && (this.mql.matches ? (this.$menu.removeAttribute("hidden"), this.$menuButton.setAttribute("hidden", "")) : (this.$menuButton.removeAttribute("hidden"), this.$menuButton.setAttribute("aria-expanded", this.menuIsOpen.toString()), this.menuIsOpen ? this.$menu.removeAttribute("hidden") : this.$menu.setAttribute("hidden", "")))
+ }
+ handleMenuButtonClick() {
+ this.menuIsOpen = !this.menuIsOpen, this.checkMode()
+ }
+}
+ServiceNavigation.moduleName = "govuk-service-navigation";
class SkipLink extends GOVUKFrontendComponent {
constructor(e) {
var t;
@@ -1095,6 +1134,7 @@ function initAll(e) {
[NotificationBanner, e.notificationBanner],
[PasswordInput, e.passwordInput],
[Radios],
+ [ServiceNavigation],
[SkipLink],
[Tabs]
],
@@ -1126,9 +1166,10 @@ export {
NotificationBanner,
PasswordInput,
Radios,
+ ServiceNavigation,
SkipLink,
Tabs,
createAll,
initAll,
version
-}; //# sourceMappingURL=govuk-frontend-5.5.0.min.js.map
\ No newline at end of file
+}; //# sourceMappingURL=govuk-frontend-5.6.0.min.js.map
\ No newline at end of file
Action run for 8dcbb4e |
Stylesheets changes to GitHub releasediff --git a/dist/govuk-frontend-5.5.0.min.css b/dist/govuk-frontend-5.6.0.min.css
index f01266081..6ffaf3b36 100644
--- a/dist/govuk-frontend-5.5.0.min.css
+++ b/dist/govuk-frontend-5.6.0.min.css
@@ -1,7 +1,7 @@
@charset "UTF-8";
:root {
- --govuk-frontend-version: "5.5.0";
+ --govuk-frontend-version: "5.6.0";
--govuk-frontend-breakpoint-mobile: 20rem;
--govuk-frontend-breakpoint-tablet: 40.0625rem;
--govuk-frontend-breakpoint-desktop: 48.0625rem
@@ -3687,6 +3687,14 @@ only screen and (min-resolution:2dppx) {
clear: both
}
+.govuk-header--full-width-border {
+ border-bottom-color: #1d70b8
+}
+
+.govuk-header--full-width-border .govuk-header__container {
+ border-bottom-color: transparent
+}
+
.govuk-header__logotype {
display: inline-block;
position: relative;
@@ -5117,6 +5125,311 @@ screen and (forced-colors:active) {
border-color: #0b0c0c
}
+.govuk-service-navigation {
+ border-bottom: 1px solid #b1b4b6;
+ background-color: #f3f2f1
+}
+
+.govuk-service-navigation__container {
+ display: flex;
+ flex-direction: column;
+ align-items: start
+}
+
+@media (min-width:40.0625em) {
+ .govuk-service-navigation__container {
+ flex-direction: row;
+ flex-wrap: wrap
+ }
+}
+
+.govuk-service-navigation__item,
+.govuk-service-navigation__service-name {
+ position: relative;
+ margin: 10px 0;
+ border: 0 solid #1a65a6
+}
+
+@media (min-width:40.0625em) {
+
+ .govuk-service-navigation__item,
+ .govuk-service-navigation__service-name {
+ margin-top: 0;
+ margin-bottom: 0;
+ padding: 20px 0
+ }
+
+ .govuk-service-navigation__item:not(:last-child),
+ .govuk-service-navigation__service-name:not(:last-child) {
+ margin-right: 20px
+ }
+}
+
+@media (min-width:40.0625em) and (min-width:40.0625em) {
+
+ .govuk-service-navigation__item:not(:last-child),
+ .govuk-service-navigation__service-name:not(:last-child) {
+ margin-right: 30px
+ }
+}
+
+@media (max-width:40.0525em) {
+ .govuk-service-navigation__item--active {
+ margin-left: -15px;
+ padding-left: 10px;
+ border-left-width: 5px
+ }
+}
+
+@media (min-width:40.0625em) {
+ .govuk-service-navigation__item--active {
+ padding-bottom: 15px;
+ border-bottom-width: 5px
+ }
+}
+
+.govuk-service-navigation__link {
+ font-family: GDS Transport, arial, sans-serif;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ text-decoration: underline;
+ text-decoration-thickness: max(1px, .0625rem);
+ text-underline-offset: .1578em
+}
+
+@media print {
+ .govuk-service-navigation__link {
+ font-family: sans-serif
+ }
+}
+
+.govuk-service-navigation__link:hover {
+ text-decoration-thickness: max(3px, .1875rem, .12em);
+ -webkit-text-decoration-skip-ink: none;
+ text-decoration-skip-ink: none;
+ -webkit-text-decoration-skip: none;
+ text-decoration-skip: none
+}
+
+.govuk-service-navigation__link:focus {
+ outline: 3px solid transparent;
+ background-color: #fd0;
+ box-shadow: 0 -2px #fd0, 0 4px #0b0c0c;
+ text-decoration: none;
+ -webkit-box-decoration-break: clone;
+ box-decoration-break: clone
+}
+
+.govuk-service-navigation__link:not(:hover):not(:active) {
+ text-decoration: none
+}
+
+.govuk-service-navigation__link:link,
+.govuk-service-navigation__link:visited {
+ color: #1d70b8
+}
+
+.govuk-service-navigation__link:hover {
+ color: #003078
+}
+
+.govuk-service-navigation__link:active,
+.govuk-service-navigation__link:focus {
+ color: #0b0c0c
+}
+
+.govuk-service-navigation__link:not(:hover):not(:focus) {
+ color: #1a65a6
+}
+
+.govuk-service-navigation__service-name {
+ font-family: GDS Transport, arial, sans-serif;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ font-weight: 700;
+ font-size: 1rem;
+ line-height: 1.25
+}
+
+@media print {
+ .govuk-service-navigation__service-name {
+ font-family: sans-serif
+ }
+}
+
+@media (min-width:40.0625em) {
+ .govuk-service-navigation__service-name {
+ font-size: 1.1875rem;
+ line-height: 1.3157894737
+ }
+}
+
+@media print {
+ .govuk-service-navigation__service-name {
+ font-size: 14pt;
+ line-height: 1.15
+ }
+}
+
+.govuk-service-navigation__service-name .govuk-service-navigation__link:link,
+.govuk-service-navigation__service-name .govuk-service-navigation__link:visited {
+ color: #0b0c0c
+}
+
+@media print {
+
+ .govuk-service-navigation__service-name .govuk-service-navigation__link:link,
+ .govuk-service-navigation__service-name .govuk-service-navigation__link:visited {
+ color: #000
+ }
+}
+
+.govuk-service-navigation__service-name .govuk-service-navigation__link:hover {
+ color: rgba(11, 12, 12, .99)
+}
+
+.govuk-service-navigation__service-name .govuk-service-navigation__link:active,
+.govuk-service-navigation__service-name .govuk-service-navigation__link:focus {
+ color: #0b0c0c
+}
+
+@media print {
+
+ .govuk-service-navigation__service-name .govuk-service-navigation__link:active,
+ .govuk-service-navigation__service-name .govuk-service-navigation__link:focus {
+ color: #000
+ }
+}
+
+.govuk-service-navigation__toggle {
+ font-family: GDS Transport, arial, sans-serif;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ font-weight: 700;
+ font-size: 1rem;
+ line-height: 1.25;
+ display: inline-flex;
+ margin: 0 0 10px;
+ padding: 0;
+ border: 0;
+ color: #1a65a6;
+ background: none;
+ word-break: break-all;
+ cursor: pointer;
+ align-items: center
+}
+
+@media print {
+ .govuk-service-navigation__toggle {
+ font-family: sans-serif
+ }
+}
+
+@media (min-width:40.0625em) {
+ .govuk-service-navigation__toggle {
+ font-size: 1.1875rem;
+ line-height: 1.3157894737
+ }
+}
+
+@media print {
+ .govuk-service-navigation__toggle {
+ font-size: 14pt;
+ line-height: 1.15
+ }
+}
+
+.govuk-service-navigation__toggle:focus {
+ outline: 3px solid transparent;
+ color: #0b0c0c;
+ background-color: #fd0;
+ box-shadow: 0 -2px #fd0, 0 4px #0b0c0c;
+ text-decoration: none;
+ -webkit-box-decoration-break: clone;
+ box-decoration-break: clone
+}
+
+.govuk-service-navigation__toggle:after {
+ display: inline-block;
+ width: 0;
+ height: 0;
+ -webkit-clip-path: polygon(0 0, 50% 100%, 100% 0);
+ clip-path: polygon(0 0, 50% 100%, 100% 0);
+ border-color: transparent;
+ border-style: solid;
+ border-width: 8.66px 5px 0;
+ border-top-color: inherit;
+ content: "";
+ margin-left: 5px
+}
+
+.govuk-service-navigation__toggle[aria-expanded=true]:after {
+ display: inline-block;
+ width: 0;
+ height: 0;
+ -webkit-clip-path: polygon(50% 0, 0 100%, 100% 100%);
+ clip-path: polygon(50% 0, 0 100%, 100% 100%);
+ border-color: transparent;
+ border-style: solid;
+ border-width: 0 5px 8.66px;
+ border-bottom-color: inherit
+}
+
+.govuk-service-navigation__toggle[hidden] {
+ display: none
+}
+
+.govuk-service-navigation__list {
+ font-family: GDS Transport, arial, sans-serif;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ font-weight: 400;
+ font-size: 1rem;
+ line-height: 1.25;
+ margin: 0 0 15px;
+ padding: 0;
+ list-style: none
+}
+
+@media print {
+ .govuk-service-navigation__list {
+ font-family: sans-serif
+ }
+}
+
+@media (min-width:40.0625em) {
+ .govuk-service-navigation__list {
+ font-size: 1.1875rem;
+ line-height: 1.3157894737
+ }
+}
+
+@media print {
+ .govuk-service-navigation__list {
+ font-size: 14pt;
+ line-height: 1.15
+ }
+}
+
+@media (min-width:40.0625em) {
+ .govuk-service-navigation__list {
+ display: flex;
+ flex-wrap: wrap;
+ margin-bottom: 0
+ }
+}
+
+@media (min-width:40.0625em) and (-ms-high-contrast:none),
+screen and (min-width:40.0625em) and (-ms-high-contrast:active) {
+ .govuk-service-navigation__list {
+ display: block
+ }
+}
+
+.govuk-service-navigation__active-fallback {
+ font-weight: inherit
+}
+
.govuk-skip-link {
font-family: GDS Transport, arial, sans-serif;
-webkit-font-smoothing: antialiased;
@@ -7609,4 +7922,4 @@ screen and (-ms-high-contrast:active) {
}
}
-/*# sourceMappingURL=govuk-frontend-5.5.0.min.css.map */
\ No newline at end of file
+/*# sourceMappingURL=govuk-frontend-5.6.0.min.css.map */
\ No newline at end of file
Action run for 8dcbb4e |
Other changes to GitHub releasediff --git a/dist/VERSION.txt b/dist/VERSION.txt
index d50359de1..1bc788d3b 100644
--- a/dist/VERSION.txt
+++ b/dist/VERSION.txt
@@ -1 +1 @@
-5.5.0
+5.6.0
Action run for 8dcbb4e |
owenatgov
approved these changes
Aug 29, 2024
📋 StatsFile sizes
Modules
View stats and visualisations on the review app Action run for 8dcbb4e |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
v5.6.0 (Feature release)
To install this version with npm, run
npm install [email protected]. You can also find more information about how to stay up to date in our documentation.New features
Make it easier to navigate complex services with the Service navigation component
We've added a new Service navigation component to help users to navigate services with multiple top-level sections. This replaces the navigation functions of the Header component, which will be deprecated in a future release of GOV.UK Frontend.
This component includes some features we consider experimental. We intend to iterate these features in response to user feedback. These are:
We introduced this change in pull request #5206: Service navigation component.