govuk_publishing_components 24.9.4 → 24.11.0
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/analytics/pii.js +1 -1
- data/app/assets/javascripts/govuk_publishing_components/analytics/scroll-tracker.js +6 -248
- data/app/assets/javascripts/govuk_publishing_components/components/accordion.js +2 -3
- data/app/assets/javascripts/govuk_publishing_components/components/cookie-banner.js +1 -0
- data/app/assets/javascripts/govuk_publishing_components/components/feedback.js +142 -104
- data/app/assets/javascripts/govuk_publishing_components/components/reorderable-list.js +1 -1
- data/app/assets/javascripts/govuk_publishing_components/components/show-password.js +12 -0
- data/app/assets/javascripts/govuk_publishing_components/components/step-by-step-nav.js +2 -2
- data/app/assets/javascripts/govuk_publishing_components/lib/trigger-event.js +18 -0
- data/app/assets/stylesheets/govuk_publishing_components/_all_components_print.scss +0 -11
- data/app/assets/stylesheets/govuk_publishing_components/components/_accordion.scss +34 -34
- data/app/assets/stylesheets/govuk_publishing_components/components/_govspeak.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/_metadata.scss +15 -18
- data/app/assets/stylesheets/govuk_publishing_components/components/_notice.scss +4 -2
- data/app/assets/stylesheets/govuk_publishing_components/components/_search.scss +4 -4
- data/app/assets/stylesheets/govuk_publishing_components/components/_step-by-step-nav.scss +20 -20
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_advisory.scss +27 -24
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_attachment.scss +1 -1
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_button.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_call-to-action.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_charts.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_contact.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_example.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_footnotes.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_form-download.scss +19 -16
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_fraction.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_highlight-answer.scss +30 -27
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_images.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_information-callout.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_legislative-list.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_place.scss +26 -21
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_stat-headline.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_steps.scss +19 -16
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_summary.scss +21 -18
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_tables.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_typography.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_warning-callout.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/helpers/_px-to-em.scss +2 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/print/_attachment.scss +2 -3
- data/app/assets/stylesheets/govuk_publishing_components/components/print/_back-link.scss +2 -3
- data/app/assets/stylesheets/govuk_publishing_components/components/print/_button.scss +0 -4
- data/app/assets/stylesheets/govuk_publishing_components/components/print/_feedback.scss +2 -3
- data/app/assets/stylesheets/govuk_publishing_components/components/print/_layout-footer.scss +2 -6
- data/app/assets/stylesheets/govuk_publishing_components/components/print/_layout-header.scss +2 -3
- data/app/assets/stylesheets/govuk_publishing_components/components/print/_metadata.scss +2 -6
- data/app/assets/stylesheets/govuk_publishing_components/components/print/_search.scss +2 -3
- data/app/assets/stylesheets/govuk_publishing_components/components/print/_share-links.scss +2 -3
- data/app/assets/stylesheets/govuk_publishing_components/components/print/_skip-link.scss +2 -3
- data/app/assets/stylesheets/govuk_publishing_components/components/print/_step-by-step-nav-header.scss +0 -4
- data/app/assets/stylesheets/govuk_publishing_components/components/print/_subscription-links.scss +2 -3
- data/app/assets/stylesheets/govuk_publishing_components/components/print/_translation-nav.scss +2 -3
- data/app/views/govuk_publishing_components/components/_attachment.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_back_link.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_button.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_feedback.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_government_navigation.html.erb +7 -7
- data/app/views/govuk_publishing_components/components/_layout_footer.html.erb +2 -2
- data/app/views/govuk_publishing_components/components/_layout_header.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_machine_readable_metadata.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_metadata.html.erb +9 -8
- data/app/views/govuk_publishing_components/components/_notice.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_phase_banner.html.erb +1 -5
- data/app/views/govuk_publishing_components/components/_previous_and_next_navigation.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_print_link.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_radio.html.erb +6 -11
- data/app/views/govuk_publishing_components/components/_search.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_share_links.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_show_password.html.erb +2 -0
- data/app/views/govuk_publishing_components/components/_skip_link.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_step_by_step_nav.html.erb +6 -6
- data/app/views/govuk_publishing_components/components/_step_by_step_nav_related.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_subscription_links.html.erb +2 -2
- data/app/views/govuk_publishing_components/components/_success_alert.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_translation_nav.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/docs/feedback.yml +2 -0
- data/app/views/govuk_publishing_components/components/docs/phase_banner.yml +2 -2
- data/app/views/govuk_publishing_components/components/docs/show_password.yml +10 -0
- data/app/views/govuk_publishing_components/components/layout_header/_navigation_items.html.erb +2 -2
- data/app/views/govuk_publishing_components/components/metadata/_sentence.html.erb +4 -4
- data/app/views/govuk_publishing_components/components/related_navigation/_section.html.erb +2 -2
- data/config/locales/ar.yml +123 -0
- data/config/locales/az.yml +123 -0
- data/config/locales/be.yml +123 -0
- data/config/locales/bg.yml +123 -0
- data/config/locales/bn.yml +123 -0
- data/config/locales/cs.yml +123 -0
- data/config/locales/cy.yml +115 -6
- data/config/locales/da.yml +123 -0
- data/config/locales/de.yml +123 -0
- data/config/locales/dr.yml +123 -0
- data/config/locales/el.yml +123 -0
- data/config/locales/en.yml +111 -103
- data/config/locales/es-419.yml +123 -0
- data/config/locales/es.yml +123 -0
- data/config/locales/et.yml +120 -0
- data/config/locales/fa.yml +123 -0
- data/config/locales/fi.yml +123 -0
- data/config/locales/fr.yml +120 -0
- data/config/locales/gd.yml +123 -0
- data/config/locales/gu.yml +123 -0
- data/config/locales/he.yml +123 -0
- data/config/locales/hi.yml +123 -0
- data/config/locales/hr.yml +123 -0
- data/config/locales/hu.yml +123 -0
- data/config/locales/hy.yml +123 -0
- data/config/locales/id.yml +123 -0
- data/config/locales/is.yml +123 -0
- data/config/locales/it.yml +123 -0
- data/config/locales/ja.yml +123 -0
- data/config/locales/ka.yml +123 -0
- data/config/locales/kk.yml +123 -0
- data/config/locales/ko.yml +123 -0
- data/config/locales/lt.yml +123 -0
- data/config/locales/lv.yml +123 -0
- data/config/locales/ms.yml +123 -0
- data/config/locales/mt.yml +123 -0
- data/config/locales/nl.yml +123 -0
- data/config/locales/no.yml +124 -1
- data/config/locales/pa-pk.yml +123 -0
- data/config/locales/pa.yml +123 -0
- data/config/locales/pl.yml +123 -0
- data/config/locales/ps.yml +123 -0
- data/config/locales/pt.yml +123 -0
- data/config/locales/ro.yml +123 -0
- data/config/locales/ru.yml +123 -0
- data/config/locales/si.yml +123 -0
- data/config/locales/sk.yml +123 -0
- data/config/locales/sl.yml +123 -0
- data/config/locales/so.yml +123 -0
- data/config/locales/sq.yml +123 -0
- data/config/locales/sr.yml +123 -0
- data/config/locales/sv.yml +123 -0
- data/config/locales/sw.yml +123 -0
- data/config/locales/ta.yml +123 -0
- data/config/locales/th.yml +123 -0
- data/config/locales/tk.yml +123 -0
- data/config/locales/tr.yml +123 -0
- data/config/locales/uk.yml +123 -0
- data/config/locales/ur.yml +123 -0
- data/config/locales/uz.yml +123 -0
- data/config/locales/vi.yml +123 -0
- data/config/locales/zh-hk.yml +123 -0
- data/config/locales/zh-tw.yml +123 -0
- data/config/locales/zh.yml +123 -0
- data/lib/govuk_publishing_components/presenters/breadcrumb_selector.rb +5 -0
- data/lib/govuk_publishing_components/presenters/content_breadcrumbs_based_on_taxons.rb +1 -2
- data/lib/govuk_publishing_components/presenters/content_item.rb +4 -0
- data/lib/govuk_publishing_components/presenters/contextual_navigation.rb +4 -0
- data/lib/govuk_publishing_components/presenters/machine_readable/page.rb +4 -0
- data/lib/govuk_publishing_components/version.rb +1 -1
- data/node_modules/govuk-frontend/govuk/components/accordion/_index.scss +7 -16
- data/node_modules/govuk-frontend/govuk/components/back-link/_index.scss +4 -15
- data/node_modules/govuk-frontend/govuk/components/character-count/macro-options.json +1 -1
- data/node_modules/govuk-frontend/govuk/components/checkboxes/macro-options.json +3 -3
- data/node_modules/govuk-frontend/govuk/components/cookie-banner/README.md +15 -0
- data/node_modules/govuk-frontend/govuk/components/cookie-banner/fixtures.json +40 -22
- data/node_modules/govuk-frontend/govuk/components/cookie-banner/macro-options.json +6 -6
- data/node_modules/govuk-frontend/govuk/components/cookie-banner/template.njk +15 -5
- data/node_modules/govuk-frontend/govuk/components/date-input/macro-options.json +2 -2
- data/node_modules/govuk-frontend/govuk/components/details/_index.scss +5 -1
- data/node_modules/govuk-frontend/govuk/components/file-upload/_index.scss +13 -14
- data/node_modules/govuk-frontend/govuk/components/file-upload/macro-options.json +1 -1
- data/node_modules/govuk-frontend/govuk/components/footer/_index.scss +14 -19
- data/node_modules/govuk-frontend/govuk/components/header/_index.scss +39 -21
- data/node_modules/govuk-frontend/govuk/components/input/macro-options.json +1 -1
- data/node_modules/govuk-frontend/govuk/components/phase-banner/_index.scss +1 -1
- data/node_modules/govuk-frontend/govuk/components/radios/macro-options.json +3 -3
- data/node_modules/govuk-frontend/govuk/components/select/macro-options.json +1 -1
- data/node_modules/govuk-frontend/govuk/components/skip-link/_index.scss +1 -1
- data/node_modules/govuk-frontend/govuk/components/tabs/_index.scss +1 -6
- data/node_modules/govuk-frontend/govuk/components/textarea/macro-options.json +1 -1
- data/node_modules/govuk-frontend/govuk/components/warning-text/_index.scss +10 -0
- data/node_modules/govuk-frontend/govuk/core/_links.scss +8 -0
- data/node_modules/govuk-frontend/govuk/helpers/_links.scss +153 -38
- data/node_modules/govuk-frontend/govuk/settings/_all.scss +2 -0
- data/node_modules/govuk-frontend/govuk/settings/_links.scss +62 -0
- data/node_modules/govuk-frontend/package.json +1 -1
- metadata +20 -4
- data/app/assets/javascripts/component_guide/visual-regression.js +0 -71
@@ -60,6 +60,11 @@ module GovukPublishingComponents
|
|
60
60
|
step_by_step: false,
|
61
61
|
breadcrumbs: navigation.breadcrumbs,
|
62
62
|
}
|
63
|
+
elsif navigation.content_is_travel_advice?
|
64
|
+
{
|
65
|
+
step_by_step: false,
|
66
|
+
breadcrumbs: navigation.breadcrumbs,
|
67
|
+
}
|
63
68
|
elsif navigation.content_has_a_topic?
|
64
69
|
{
|
65
70
|
step_by_step: false,
|
@@ -14,7 +14,7 @@ module GovukPublishingComponents
|
|
14
14
|
ordered_parents = all_parents.map.with_index do |parent, index|
|
15
15
|
{
|
16
16
|
title: parent.title,
|
17
|
-
url: parent.base_path,
|
17
|
+
url: parent.url_override.present? ? parent.url_override : parent.base_path,
|
18
18
|
is_page_parent: index.zero?,
|
19
19
|
}
|
20
20
|
end
|
@@ -34,7 +34,6 @@ module GovukPublishingComponents
|
|
34
34
|
|
35
35
|
def all_parents
|
36
36
|
parents = []
|
37
|
-
|
38
37
|
direct_parent = content_item.parent_taxon
|
39
38
|
while direct_parent
|
40
39
|
parents << direct_parent
|
@@ -16,6 +16,10 @@ module GovukPublishingComponents
|
|
16
16
|
content_item["document_type"] == "simple_smart_answer"
|
17
17
|
end
|
18
18
|
|
19
|
+
def content_is_travel_advice?
|
20
|
+
content_item["document_type"] == "travel_advice"
|
21
|
+
end
|
22
|
+
|
19
23
|
def html_publication_with_parent?
|
20
24
|
(content_item["document_type"] == "html_publication") && parent_api_path
|
21
25
|
end
|
@@ -1,9 +1,4 @@
|
|
1
1
|
@include govuk-exports("govuk/component/accordion") {
|
2
|
-
|
3
|
-
$govuk-accordion-link-colour: $govuk-link-colour;
|
4
|
-
$govuk-accordion-link-hover-colour: govuk-colour("light-blue");
|
5
|
-
$govuk-accordion-border-width: 3px;
|
6
|
-
|
7
2
|
.govuk-accordion {
|
8
3
|
@include govuk-responsive-margin(6, "bottom");
|
9
4
|
}
|
@@ -98,19 +93,9 @@
|
|
98
93
|
// Safe area on the right to avoid clashing with icon
|
99
94
|
padding-right: 40px;
|
100
95
|
border-top: 1px solid $govuk-border-colour;
|
101
|
-
color: $govuk-accordion-link-colour;
|
102
96
|
cursor: pointer;
|
103
97
|
}
|
104
98
|
|
105
|
-
// For devices that can't hover such as touch devices,
|
106
|
-
// remove hover state as it can be stuck in that state (iOS).
|
107
|
-
@media (hover: none) {
|
108
|
-
.govuk-accordion__section-header:hover {
|
109
|
-
border-top-color: $govuk-accordion-link-colour;
|
110
|
-
box-shadow: inset 0 $govuk-accordion-border-width 0 0 $govuk-accordion-link-colour;
|
111
|
-
}
|
112
|
-
}
|
113
|
-
|
114
99
|
// Buttons within the headers don’t need default styling
|
115
100
|
.govuk-accordion__section-button {
|
116
101
|
@include govuk-typography-common;
|
@@ -119,7 +104,7 @@
|
|
119
104
|
margin-left: 0;
|
120
105
|
padding: 0;
|
121
106
|
border-width: 0;
|
122
|
-
color:
|
107
|
+
color: $govuk-link-colour;
|
123
108
|
background: none;
|
124
109
|
text-align: left;
|
125
110
|
cursor: pointer;
|
@@ -147,7 +132,13 @@
|
|
147
132
|
}
|
148
133
|
|
149
134
|
.govuk-accordion__section-button:hover:not(:focus) {
|
135
|
+
color: $govuk-link-hover-colour;
|
150
136
|
text-decoration: underline;
|
137
|
+
|
138
|
+
// This needs to come after the text-decoration property otherwise
|
139
|
+
// text-decoration, as a shorthand property, resets it to auto
|
140
|
+
@include govuk-link-hover-decoration;
|
141
|
+
text-underline-offset: $govuk-link-underline-offset;
|
151
142
|
}
|
152
143
|
|
153
144
|
// For devices that can't hover such as touch devices,
|
@@ -24,21 +24,6 @@
|
|
24
24
|
padding-left: 14px;
|
25
25
|
}
|
26
26
|
|
27
|
-
// Only underline if the component is linkable
|
28
|
-
.govuk-back-link[href] {
|
29
|
-
text-decoration: underline;
|
30
|
-
|
31
|
-
// When the back link is focused, hide the bottom link border as the
|
32
|
-
// focus styles has a bottom border.
|
33
|
-
&:focus {
|
34
|
-
text-decoration: none;
|
35
|
-
|
36
|
-
&:before {
|
37
|
-
border-color: $govuk-text-colour;
|
38
|
-
}
|
39
|
-
}
|
40
|
-
}
|
41
|
-
|
42
27
|
// Prepend left pointing chevron
|
43
28
|
.govuk-back-link:before {
|
44
29
|
content: "";
|
@@ -88,6 +73,10 @@
|
|
88
73
|
}
|
89
74
|
}
|
90
75
|
|
76
|
+
.govuk-back-link:focus:before {
|
77
|
+
border-color: $govuk-focus-text-colour;
|
78
|
+
}
|
79
|
+
|
91
80
|
.govuk-back-link:after {
|
92
81
|
content: "";
|
93
82
|
position: absolute;
|
@@ -72,7 +72,7 @@
|
|
72
72
|
"name": "classes",
|
73
73
|
"type": "string",
|
74
74
|
"required": false,
|
75
|
-
"description": "Classes to add to the form group (
|
75
|
+
"description": "Classes to add to the form group (for example to show error state for the whole group)"
|
76
76
|
}
|
77
77
|
]
|
78
78
|
},
|
@@ -9,14 +9,14 @@
|
|
9
9
|
"name": "fieldset",
|
10
10
|
"type": "object",
|
11
11
|
"required": false,
|
12
|
-
"description": "Options for the fieldset component (
|
12
|
+
"description": "Options for the fieldset component (for example legend).",
|
13
13
|
"isComponent": true
|
14
14
|
},
|
15
15
|
{
|
16
16
|
"name": "hint",
|
17
17
|
"type": "object",
|
18
18
|
"required": false,
|
19
|
-
"description": "Options for the hint component (
|
19
|
+
"description": "Options for the hint component (for example text).",
|
20
20
|
"isComponent": true
|
21
21
|
},
|
22
22
|
{
|
@@ -36,7 +36,7 @@
|
|
36
36
|
"name": "classes",
|
37
37
|
"type": "string",
|
38
38
|
"required": false,
|
39
|
-
"description": "Classes to add to the form group (
|
39
|
+
"description": "Classes to add to the form group (for example to show error state for the whole group)"
|
40
40
|
}
|
41
41
|
]
|
42
42
|
},
|
@@ -0,0 +1,15 @@
|
|
1
|
+
# Cookie banner
|
2
|
+
|
3
|
+
## Installation
|
4
|
+
|
5
|
+
See the [main README quick start guide](https://github.com/alphagov/govuk-frontend#quick-start) for how to install this component.
|
6
|
+
|
7
|
+
## Guidance and Examples
|
8
|
+
|
9
|
+
Find out when to use the cookie banner component in your service in the [GOV.UK Design System](https://design-system.service.gov.uk/components/cookie-banner).
|
10
|
+
|
11
|
+
## Component options
|
12
|
+
|
13
|
+
Use options to customise the appearance, content and behaviour of a component when using a macro, for example, changing the text.
|
14
|
+
|
15
|
+
See [options table](https://design-system.service.gov.uk/components/cookie-banner/#options-default-cookie-banner-example) for details.
|
@@ -29,7 +29,7 @@
|
|
29
29
|
}
|
30
30
|
]
|
31
31
|
},
|
32
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on this government service</h2>\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">We use analytics cookies to help understand how users use our service.</p></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button value=\"accept\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n Accept analytics cookies\n </button>\n \n \n \n <button value=\"reject\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n Reject analytics cookies\n </button>\n \n \n \n \n
|
32
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on this government service</h2>\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">We use analytics cookies to help understand how users use our service.</p></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button value=\"accept\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n Accept analytics cookies\n </button>\n \n \n \n <button value=\"reject\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n Reject analytics cookies\n </button>\n \n \n \n \n \n \n <a class=\"govuk-link\" href=\"/cookie-preferences\">View cookie preferences</a>\n \n \n \n </div>\n \n </div>\n \n</div>",
|
33
33
|
"hidden": false
|
34
34
|
},
|
35
35
|
{
|
@@ -48,7 +48,7 @@
|
|
48
48
|
}
|
49
49
|
]
|
50
50
|
},
|
51
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\" role=\"alert\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">Your cookie preferences have been saved. You have accepted cookies.</p></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n Hide this message\n </button>\n \n \n </div>\n \n </div>\n \n</div>",
|
51
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\" role=\"alert\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">Your cookie preferences have been saved. You have accepted cookies.</p></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n Hide this message\n </button>\n \n \n </div>\n \n </div>\n \n</div>",
|
52
52
|
"hidden": false
|
53
53
|
},
|
54
54
|
{
|
@@ -67,7 +67,7 @@
|
|
67
67
|
}
|
68
68
|
]
|
69
69
|
},
|
70
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\" role=\"alert\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">Your cookie preferences have been saved. You have rejected cookies.</p></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n Hide this message\n </button>\n \n \n </div>\n \n </div>\n \n</div>",
|
70
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\" role=\"alert\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">Your cookie preferences have been saved. You have rejected cookies.</p></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n Hide this message\n </button>\n \n \n </div>\n \n </div>\n \n</div>",
|
71
71
|
"hidden": false
|
72
72
|
},
|
73
73
|
{
|
@@ -120,7 +120,7 @@
|
|
120
120
|
}
|
121
121
|
]
|
122
122
|
},
|
123
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on this service</h2>\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">We use cookies to help understand how users use our service.</p></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button value=\"accept\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n Accept analytics cookies\n </button>\n \n \n \n <button value=\"reject\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n Reject analytics cookies\n </button>\n \n \n \n \n
|
123
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on this service</h2>\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">We use cookies to help understand how users use our service.</p></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button value=\"accept\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n Accept analytics cookies\n </button>\n \n \n \n <button value=\"reject\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n Reject analytics cookies\n </button>\n \n \n \n \n \n \n <a class=\"govuk-link\" href=\"/cookie-preferences\">View cookie preferences</a>\n \n \n \n </div>\n \n </div>\n \n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\" role=\"alert\"\n hidden>\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">Your cookie preferences have been saved. You have accepted cookies.</p></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n Hide this message\n </button>\n \n \n </div>\n \n </div>\n \n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\" role=\"alert\"\n hidden>\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">Your cookie preferences have been saved. You have rejected cookies.</p></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n Hide this message\n </button>\n \n \n </div>\n \n </div>\n \n</div>",
|
124
124
|
"hidden": false
|
125
125
|
},
|
126
126
|
{
|
@@ -132,7 +132,7 @@
|
|
132
132
|
}
|
133
133
|
]
|
134
134
|
},
|
135
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on <span>my service</span></h2>\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n </div>\n \n</div>",
|
135
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on <span>my service</span></h2>\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n </div>\n \n</div>",
|
136
136
|
"hidden": true
|
137
137
|
},
|
138
138
|
{
|
@@ -144,7 +144,7 @@
|
|
144
144
|
}
|
145
145
|
]
|
146
146
|
},
|
147
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on <span>my service</span></h2>\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n </div>\n \n</div>",
|
147
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on <span>my service</span></h2>\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n </div>\n \n</div>",
|
148
148
|
"hidden": true
|
149
149
|
},
|
150
150
|
{
|
@@ -156,7 +156,7 @@
|
|
156
156
|
}
|
157
157
|
]
|
158
158
|
},
|
159
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">We use cookies in <span>our service</span>.</p></div>\n </div>\n </div>\n\n \n </div>\n \n</div>",
|
159
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">We use cookies in <span>our service</span>.</p></div>\n </div>\n </div>\n\n \n </div>\n \n</div>",
|
160
160
|
"hidden": true
|
161
161
|
},
|
162
162
|
{
|
@@ -168,7 +168,7 @@
|
|
168
168
|
}
|
169
169
|
]
|
170
170
|
},
|
171
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container app-my-class\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n </div>\n \n</div>",
|
171
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container app-my-class\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n </div>\n \n</div>",
|
172
172
|
"hidden": true
|
173
173
|
},
|
174
174
|
{
|
@@ -182,7 +182,7 @@
|
|
182
182
|
}
|
183
183
|
]
|
184
184
|
},
|
185
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\" data-attribute=\"my-value\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n </div>\n \n</div>",
|
185
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\" data-attribute=\"my-value\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n </div>\n \n</div>",
|
186
186
|
"hidden": true
|
187
187
|
},
|
188
188
|
{
|
@@ -195,7 +195,7 @@
|
|
195
195
|
}
|
196
196
|
]
|
197
197
|
},
|
198
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookies on GOV.UK\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">We use cookies on GOV.UK</p></div>\n </div>\n </div>\n\n \n </div>\n \n</div>",
|
198
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookies on GOV.UK\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">We use cookies on GOV.UK</p></div>\n </div>\n </div>\n\n \n </div>\n \n</div>",
|
199
199
|
"hidden": true
|
200
200
|
},
|
201
201
|
{
|
@@ -207,7 +207,7 @@
|
|
207
207
|
}
|
208
208
|
]
|
209
209
|
},
|
210
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n hidden>\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n </div>\n \n</div>",
|
210
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n hidden>\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n </div>\n \n</div>",
|
211
211
|
"hidden": true
|
212
212
|
},
|
213
213
|
{
|
@@ -219,7 +219,7 @@
|
|
219
219
|
}
|
220
220
|
]
|
221
221
|
},
|
222
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n </div>\n \n</div>",
|
222
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n </div>\n \n</div>",
|
223
223
|
"hidden": true
|
224
224
|
},
|
225
225
|
{
|
@@ -235,7 +235,7 @@
|
|
235
235
|
}
|
236
236
|
]
|
237
237
|
},
|
238
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button class=\"govuk-button\" data-module=\"govuk-button\">\n This is a button\n </button>\n \n \n </div>\n \n </div>\n \n</div>",
|
238
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button class=\"govuk-button\" data-module=\"govuk-button\">\n This is a button\n </button>\n \n \n </div>\n \n </div>\n \n</div>",
|
239
239
|
"hidden": true
|
240
240
|
},
|
241
241
|
{
|
@@ -252,11 +252,11 @@
|
|
252
252
|
}
|
253
253
|
]
|
254
254
|
},
|
255
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n \n
|
255
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n \n \n \n <a class=\"govuk-link\" href=\"/link\">This is a link</a>\n \n \n \n </div>\n \n </div>\n \n</div>",
|
256
256
|
"hidden": true
|
257
257
|
},
|
258
258
|
{
|
259
|
-
"name": "link with button options",
|
259
|
+
"name": "link with false button options",
|
260
260
|
"options": {
|
261
261
|
"messages": [
|
262
262
|
{
|
@@ -271,7 +271,25 @@
|
|
271
271
|
}
|
272
272
|
]
|
273
273
|
},
|
274
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n \n
|
274
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n \n \n \n <a class=\"govuk-link\" href=\"/link\">This is a link</a>\n \n \n \n </div>\n \n </div>\n \n</div>",
|
275
|
+
"hidden": true
|
276
|
+
},
|
277
|
+
{
|
278
|
+
"name": "link as a button",
|
279
|
+
"options": {
|
280
|
+
"messages": [
|
281
|
+
{
|
282
|
+
"actions": [
|
283
|
+
{
|
284
|
+
"text": "This is a link",
|
285
|
+
"href": "/link",
|
286
|
+
"type": "button"
|
287
|
+
}
|
288
|
+
]
|
289
|
+
}
|
290
|
+
]
|
291
|
+
},
|
292
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n \n <a href=\"/link\" role=\"button\" draggable=\"false\" class=\"govuk-button\" data-module=\"govuk-button\">\n This is a link\n </a>\n \n \n \n </div>\n \n </div>\n \n</div>",
|
275
293
|
"hidden": true
|
276
294
|
},
|
277
295
|
{
|
@@ -288,7 +306,7 @@
|
|
288
306
|
}
|
289
307
|
]
|
290
308
|
},
|
291
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n Button\n </button>\n \n \n </div>\n \n </div>\n \n</div>",
|
309
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n Button\n </button>\n \n \n </div>\n \n </div>\n \n</div>",
|
292
310
|
"hidden": true
|
293
311
|
},
|
294
312
|
{
|
@@ -305,7 +323,7 @@
|
|
305
323
|
}
|
306
324
|
]
|
307
325
|
},
|
308
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button class=\"govuk-button my-button-class app-button-class\" data-module=\"govuk-button\">\n Button with custom classes\n </button>\n \n \n </div>\n \n </div>\n \n</div>",
|
326
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button class=\"govuk-button my-button-class app-button-class\" data-module=\"govuk-button\">\n Button with custom classes\n </button>\n \n \n </div>\n \n </div>\n \n</div>",
|
309
327
|
"hidden": true
|
310
328
|
},
|
311
329
|
{
|
@@ -324,7 +342,7 @@
|
|
324
342
|
}
|
325
343
|
]
|
326
344
|
},
|
327
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button class=\"govuk-button\" data-module=\"govuk-button\" data-button-attribute=\"my-value\">\n Button with attributes\n </button>\n \n \n </div>\n \n </div>\n \n</div>",
|
345
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button class=\"govuk-button\" data-module=\"govuk-button\" data-button-attribute=\"my-value\">\n Button with attributes\n </button>\n \n \n </div>\n \n </div>\n \n</div>",
|
328
346
|
"hidden": true
|
329
347
|
},
|
330
348
|
{
|
@@ -342,7 +360,7 @@
|
|
342
360
|
}
|
343
361
|
]
|
344
362
|
},
|
345
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n \n
|
363
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n \n \n \n \n \n <a class=\"govuk-link my-link-class app-link-class\" href=\"/my-link\">Link with custom classes</a>\n \n \n \n </div>\n \n </div>\n \n</div>",
|
346
364
|
"hidden": true
|
347
365
|
},
|
348
366
|
{
|
@@ -362,7 +380,7 @@
|
|
362
380
|
}
|
363
381
|
]
|
364
382
|
},
|
365
|
-
"html": "<div class=\"govuk-cookie-banner \" role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n \n
|
383
|
+
"html": "<div class=\"govuk-cookie-banner \" data-nosnippet role=\"region\" aria-label=\"Cookie banner\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n \n \n \n <a class=\"govuk-link\" href=\"/link\" data-link-attribute=\"my-value\">Link with attributes</a>\n \n \n \n </div>\n \n </div>\n \n</div>",
|
366
384
|
"hidden": true
|
367
385
|
},
|
368
386
|
{
|
@@ -418,7 +436,7 @@
|
|
418
436
|
}
|
419
437
|
]
|
420
438
|
},
|
421
|
-
"html": "<div class=\"govuk-cookie-banner hide-cookie-banner\" role=\"region\" aria-label=\"Cookie banner\" hidden data-hide-cookie-banner=\"true\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on this service</h2>\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">We use cookies to help understand how users use our service.</p></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button value=\"accept\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n Accept analytics cookies\n </button>\n \n \n \n <button value=\"reject\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n Reject analytics cookies\n </button>\n \n \n \n \n
|
439
|
+
"html": "<div class=\"govuk-cookie-banner hide-cookie-banner\" data-nosnippet role=\"region\" aria-label=\"Cookie banner\" hidden data-hide-cookie-banner=\"true\">\n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n <h2 class=\"govuk-cookie-banner__heading govuk-heading-m\">Cookies on this service</h2>\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">We use cookies to help understand how users use our service.</p></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button value=\"accept\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n Accept analytics cookies\n </button>\n \n \n \n <button value=\"reject\" type=\"submit\" name=\"cookies\" class=\"govuk-button\" data-module=\"govuk-button\">\n Reject analytics cookies\n </button>\n \n \n \n \n \n \n <a class=\"govuk-link\" href=\"/cookie-preferences\">View cookie preferences</a>\n \n \n \n </div>\n \n </div>\n \n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\" role=\"alert\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">Your cookie preferences have been saved. You have accepted cookies.</p></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n Hide this message\n </button>\n \n \n </div>\n \n </div>\n \n \n \n\n <div class=\"govuk-cookie-banner__message govuk-width-container\" role=\"alert\"\n >\n\n <div class=\"govuk-grid-row\">\n <div class=\"govuk-grid-column-two-thirds\">\n \n\n <div class=\"govuk-cookie-banner__content\"><p class=\"govuk-body\">Your cookie preferences have been saved. You have rejected cookies.</p></div>\n </div>\n </div>\n\n \n <div class=\"govuk-button-group\">\n \n \n <button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n Hide this message\n </button>\n \n \n </div>\n \n </div>\n \n</div>",
|
422
440
|
"hidden": true
|
423
441
|
}
|
424
442
|
]
|
@@ -3,7 +3,7 @@
|
|
3
3
|
"name": "ariaLabel",
|
4
4
|
"type": "string",
|
5
5
|
"required": false,
|
6
|
-
"description": "The text for the `aria-label` which labels the cookie banner region. This region applies to all messages that the cookie banner includes. For example, the cookie message and the
|
6
|
+
"description": "The text for the `aria-label` which labels the cookie banner region. This region applies to all messages that the cookie banner includes. For example, the cookie message and the confirmation message. Defaults to \"Cookie banner\"."
|
7
7
|
},
|
8
8
|
{
|
9
9
|
"name": "hidden",
|
@@ -27,7 +27,7 @@
|
|
27
27
|
"name": "messages",
|
28
28
|
"type": "array",
|
29
29
|
"required": true,
|
30
|
-
"description": "The different messages you can pass into the cookie banner. For example, the cookie message and the
|
30
|
+
"description": "The different messages you can pass into the cookie banner. For example, the cookie message and the confirmation message.",
|
31
31
|
"params": [
|
32
32
|
{
|
33
33
|
"name": "headingText",
|
@@ -69,13 +69,13 @@
|
|
69
69
|
"name": "type",
|
70
70
|
"type": "string",
|
71
71
|
"required": false,
|
72
|
-
"description": "The type of button.
|
72
|
+
"description": "The type of button. You can set `button` or `submit`. Set `button` and `href` to render a link styled as a button. If you set `href`, it overrides `submit`."
|
73
73
|
},
|
74
74
|
{
|
75
75
|
"name": "href",
|
76
76
|
"type": "string",
|
77
77
|
"required": false,
|
78
|
-
"description": "The `href` for a link.
|
78
|
+
"description": "The `href` for a link. Set `button` and `href` to render a link styled as a button."
|
79
79
|
},
|
80
80
|
{
|
81
81
|
"name": "name",
|
@@ -107,13 +107,13 @@
|
|
107
107
|
"name": "hidden",
|
108
108
|
"type": "boolean",
|
109
109
|
"required": false,
|
110
|
-
"description": "Defaults to `false`. If you set it to `true`, the message is hidden. You can use `hidden` for client-side implementations where the
|
110
|
+
"description": "Defaults to `false`. If you set it to `true`, the message is hidden. You can use `hidden` for client-side implementations where the confirmation message HTML is present, but hidden on the page."
|
111
111
|
},
|
112
112
|
{
|
113
113
|
"name": "role",
|
114
114
|
"type": "string",
|
115
115
|
"required": false,
|
116
|
-
"description": "Set `role` to `alert` on
|
116
|
+
"description": "Set `role` to `alert` on confirmation messages to allow assistive tech to automatically read the message. You will also need to move focus to the confirmation message using JavaScript you have written yourself."
|
117
117
|
},
|
118
118
|
{
|
119
119
|
"name": "classes",
|