govuk_publishing_components 27.8.1 → 27.9.2
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/assets/javascripts/govuk_publishing_components/components/intervention.js +1 -0
- data/app/assets/javascripts/govuk_publishing_components/components/layout-super-navigation-header.js +18 -40
- data/app/assets/stylesheets/govuk_publishing_components/components/_intervention.scss +13 -10
- data/app/assets/stylesheets/govuk_publishing_components/components/_layout-for-public.scss +0 -12
- data/app/assets/stylesheets/govuk_publishing_components/components/_layout-super-navigation-header.scss +431 -363
- data/app/assets/stylesheets/govuk_publishing_components/components/_search.scss +17 -10
- data/app/assets/stylesheets/govuk_publishing_components/components/print/_layout-super-navigation-header.scss +2 -2
- data/app/views/govuk_publishing_components/components/_intervention.html.erb +39 -26
- data/app/views/govuk_publishing_components/components/_layout_for_public.html.erb +1 -4
- data/app/views/govuk_publishing_components/components/_layout_super_navigation_header.html.erb +80 -74
- data/app/views/govuk_publishing_components/components/_search.html.erb +1 -0
- data/app/views/govuk_publishing_components/components/docs/intervention.yml +45 -6
- data/app/views/govuk_publishing_components/components/docs/layout_for_public.yml +0 -8
- data/app/views/govuk_publishing_components/components/docs/layout_super_navigation_header.yml +12 -3
- data/app/views/govuk_publishing_components/components/docs/title.yml +0 -11
- data/app/views/govuk_publishing_components/components/layout_for_public/_account-layout.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/layout_for_public/_account-navigation.html.erb +0 -9
- data/app/views/govuk_publishing_components/components/search/_search_icon.html.erb +28 -0
- data/config/locales/en.yml +3 -14
- data/lib/govuk_publishing_components/presenters/intervention_helper.rb +19 -0
- data/lib/govuk_publishing_components/version.rb +1 -1
- data/lib/govuk_publishing_components.rb +1 -0
- metadata +4 -3
- data/app/views/govuk_publishing_components/components/layout_for_public/_account-feedback-footer.html.erb +0 -18
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 84421d91c40a900cecce84bc40059fc02803fbdb42173e03a590dc2b26904353
|
4
|
+
data.tar.gz: a23db6521a6481c233984680d2eb3c166f07b1ed321e6bf7ec6ca5e0e392b36b
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: c4c0ea74bb2365e4bd1ee66768566f96a4655f9dcfc0e369723b79bb8814c3b9e882611c45db1853552a2407ae0ae30f38dd733e27107fdadd120916d410be23
|
7
|
+
data.tar.gz: 49d57ddc1d28d67b450d1e1211195511fb93c87ed05fae9887a58c17a8617e804b8ee497978bc9a03fcb34f6fffe251795158f722e6b63398f489e0e2f1ba449
|
@@ -8,6 +8,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
|
|
8
8
|
|
9
9
|
Intervention.prototype.init = function () {
|
10
10
|
if (window.GOVUK.analytics && window.GOVUK.analytics.trackEvent) {
|
11
|
+
// Send a tracking event when this component is shown
|
11
12
|
window.GOVUK.analytics.trackEvent('interventionBanner', 'interventionShown')
|
12
13
|
}
|
13
14
|
}
|
data/app/assets/javascripts/govuk_publishing_components/components/layout-super-navigation-header.js
CHANGED
@@ -124,25 +124,11 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
|
|
124
124
|
|
125
125
|
this.hiddenButtons = this.$module.querySelectorAll('button[hidden]')
|
126
126
|
|
127
|
-
this.lastWindowSize =
|
127
|
+
this.lastWindowSize = null
|
128
128
|
}
|
129
129
|
|
130
130
|
SuperNavigationMegaMenu.prototype.windowSize = windowSize
|
131
131
|
|
132
|
-
// Resizes the space needed for the dropdown menu so that it doesn't overlap
|
133
|
-
// with the page content. As this is an event that needs to be added and
|
134
|
-
// removed it can't be be bound to `this` because that changes the fingerprint
|
135
|
-
// of the function, and makes it unable to be removed with
|
136
|
-
// `removeEventListener`.
|
137
|
-
SuperNavigationMegaMenu.prototype.resizeHandler = function () {
|
138
|
-
var $module = document.querySelector('[data-module="super-navigation-mega-menu"]')
|
139
|
-
var $openButton = $module.querySelector('[aria-expanded="true"][data-toggle-desktop-group="top"]')
|
140
|
-
var $openMenu = $openButton ? $module.querySelector('#' + $openButton.getAttribute('aria-controls')) : null
|
141
|
-
var margin = $openMenu && windowSize() === 'desktop' ? $openMenu.offsetHeight : 0
|
142
|
-
|
143
|
-
$module.style.marginBottom = margin + 'px'
|
144
|
-
}
|
145
|
-
|
146
132
|
SuperNavigationMegaMenu.prototype.updateStates = function () {
|
147
133
|
if (this.windowSize() === 'mobile' && this.lastWindowSize !== 'mobile') {
|
148
134
|
this.$navigationToggle.removeAttribute('hidden')
|
@@ -161,8 +147,21 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
|
|
161
147
|
if (this.windowSize() === 'desktop' && this.lastWindowSize !== 'desktop') {
|
162
148
|
this.$navigationToggle.setAttribute('hidden', 'hidden')
|
163
149
|
this.$navigationMenu.removeAttribute('hidden')
|
150
|
+
}
|
164
151
|
|
165
|
-
|
152
|
+
// The dropdown menu height is only needed when in desktop mode as this is
|
153
|
+
// when the dropdown menu is using `absolute` positioning. This requires
|
154
|
+
// JavaScript to work out the height and make space for the dropdown menu.
|
155
|
+
if (windowSize() === 'desktop') {
|
156
|
+
// Check whether any of the dropdown menus are open.
|
157
|
+
var $openButton = this.$module.querySelector('[aria-expanded="true"][data-toggle-desktop-group="top"]')
|
158
|
+
// Gets the open dropdown menu
|
159
|
+
var $openMenu = $openButton ? this.$module.querySelector('#' + $openButton.getAttribute('aria-controls')) : null
|
160
|
+
// If there is an open dropdown menu, get the height of the dropdown menu.
|
161
|
+
var margin = $openMenu ? $openMenu.offsetHeight : 0
|
162
|
+
|
163
|
+
// Make space for the dropdown menu.
|
164
|
+
this.$module.style.marginBottom = margin + 'px'
|
166
165
|
}
|
167
166
|
|
168
167
|
this.lastWindowSize = this.windowSize()
|
@@ -231,30 +230,9 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
|
|
231
230
|
|
232
231
|
this.lastWindowSize = this.windowSize()
|
233
232
|
|
234
|
-
// The menu needs to be updated when the window is resized
|
235
|
-
// the
|
236
|
-
|
237
|
-
// will only fire when the media query is matched so is more efficient. The
|
238
|
-
// fallback is the `window.resize` event with a check to make sure that it
|
239
|
-
// only does things when moving from mobile to desktop view.
|
240
|
-
var setupResizeListener = function () {
|
241
|
-
window.addEventListener('resize', this.updateStates.bind(this), { passive: true })
|
242
|
-
}.bind(this)
|
243
|
-
|
244
|
-
if (typeof window.matchMedia === 'function') {
|
245
|
-
// Internet Explorer 11 supports `matchMedia`, but doesn't support
|
246
|
-
// the `change` event[1] - so we try it, and then fail back to using
|
247
|
-
// `window.resize`.
|
248
|
-
// [1]: https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList/onchange
|
249
|
-
try {
|
250
|
-
window.matchMedia('screen and (min-width:' + SETTINGS.breakpoint.desktop + 'px)')
|
251
|
-
.addEventListener('change', this.updateStates.bind(this))
|
252
|
-
} catch (error) {
|
253
|
-
setupResizeListener()
|
254
|
-
}
|
255
|
-
} else {
|
256
|
-
setupResizeListener()
|
257
|
-
}
|
233
|
+
// The menu needs to be updated when the window is resized to make sure that
|
234
|
+
// the space needed for the dropdown menu is correct.
|
235
|
+
window.addEventListener('resize', this.updateStates.bind(this), { passive: true })
|
258
236
|
}
|
259
237
|
|
260
238
|
Modules.SuperNavigationMegaMenu = SuperNavigationMegaMenu
|
@@ -1,18 +1,21 @@
|
|
1
1
|
.gem-c-intervention {
|
2
2
|
@include govuk-text-colour;
|
3
|
-
@include govuk-responsive-padding(
|
4
|
-
@include govuk-responsive-padding(6, "right");
|
5
|
-
@include govuk-responsive-padding(4, "top");
|
6
|
-
@include govuk-responsive-padding(4, "bottom");
|
3
|
+
@include govuk-responsive-padding(3);
|
7
4
|
@include govuk-responsive-margin(6, "bottom");
|
8
5
|
background-color: govuk-colour("light-grey", $legacy: "grey-4");
|
9
|
-
|
10
|
-
.gem-c-intervention__title {
|
11
|
-
@include govuk-responsive-margin(0);
|
12
|
-
@include govuk-responsive-padding(4, "bottom");
|
13
|
-
}
|
6
|
+
border-left: 10px solid $govuk-success-colour;
|
14
7
|
|
15
8
|
.govuk-body:last-of-type {
|
16
|
-
|
9
|
+
margin-bottom: 0;
|
17
10
|
}
|
18
11
|
}
|
12
|
+
|
13
|
+
.gem-c-intervention__textwrapper {
|
14
|
+
display: block;
|
15
|
+
}
|
16
|
+
|
17
|
+
.gem-c-intervention__dismiss-icon {
|
18
|
+
width: 1em;
|
19
|
+
height: 1em;
|
20
|
+
margin-bottom: -2px;
|
21
|
+
}
|
@@ -52,15 +52,3 @@ $current-indicator-width: 4px;
|
|
52
52
|
color: $govuk-link-colour;
|
53
53
|
}
|
54
54
|
}
|
55
|
-
|
56
|
-
.gem-c-layout-for-public-account-feedback-footer {
|
57
|
-
margin-bottom: govuk-spacing(4);
|
58
|
-
padding: govuk-spacing(3);
|
59
|
-
background: govuk-colour("light-grey");
|
60
|
-
|
61
|
-
@include govuk-media-query($from: tablet) {
|
62
|
-
padding: govuk-spacing(6);
|
63
|
-
margin-top: govuk-spacing(2);
|
64
|
-
margin-bottom: govuk-spacing(8);
|
65
|
-
}
|
66
|
-
}
|