govuk_publishing_components 23.15.0 → 24.0.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/components/cookie-banner.js +0 -4
- data/app/assets/javascripts/govuk_publishing_components/components/step-by-step-nav.js +23 -14
- data/app/assets/stylesheets/govuk_publishing_components/_all_components.scss +0 -1
- data/app/assets/stylesheets/govuk_publishing_components/component_support.scss +0 -2
- data/app/assets/stylesheets/govuk_publishing_components/components/_error-alert.scss +4 -4
- data/app/assets/stylesheets/govuk_publishing_components/components/_step-by-step-nav.scss +101 -48
- data/app/assets/stylesheets/govuk_publishing_components/components/_success-alert.scss +8 -8
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_contact.scss +0 -5
- data/app/assets/stylesheets/govuk_publishing_components/components/print/_step-by-step-nav.scss +2 -2
- data/app/views/govuk_publishing_components/components/_document_list.html.erb +10 -1
- data/app/views/govuk_publishing_components/components/docs/contextual_sidebar.yml +5 -0
- data/app/views/govuk_publishing_components/components/docs/document_list.yml +18 -0
- data/app/views/govuk_publishing_components/components/docs/govspeak.yml +3 -3
- data/config/initializers/assets.rb +0 -1
- data/lib/govuk_publishing_components/presenters/contextual_navigation.rb +61 -2
- data/lib/govuk_publishing_components/version.rb +1 -1
- data/node_modules/govuk-frontend/govuk/all.js +1 -1
- data/node_modules/govuk-frontend/govuk/components/_all.scss +1 -0
- data/node_modules/govuk-frontend/govuk/components/breadcrumbs/fixtures.json +10 -10
- data/node_modules/govuk-frontend/govuk/components/breadcrumbs/template.njk +2 -2
- data/node_modules/govuk-frontend/govuk/components/button/_index.scss +2 -0
- data/node_modules/govuk-frontend/govuk/components/character-count/_index.scss +1 -0
- data/node_modules/govuk-frontend/govuk/components/character-count/character-count.js +1 -1
- data/node_modules/govuk-frontend/govuk/components/character-count/fixtures.json +13 -0
- data/node_modules/govuk-frontend/govuk/components/cookie-banner/_cookie-banner.scss +2 -0
- data/node_modules/govuk-frontend/govuk/components/cookie-banner/_index.scss +51 -0
- data/node_modules/govuk-frontend/govuk/components/cookie-banner/fixtures.json +425 -0
- data/node_modules/govuk-frontend/govuk/components/cookie-banner/macro-options.json +132 -0
- data/node_modules/govuk-frontend/govuk/components/cookie-banner/macro.njk +3 -0
- data/node_modules/govuk-frontend/govuk/components/cookie-banner/template.njk +63 -0
- data/node_modules/govuk-frontend/govuk/components/details/fixtures.json +2 -2
- data/node_modules/govuk-frontend/govuk/components/header/fixtures.json +18 -18
- data/node_modules/govuk-frontend/govuk/components/header/template.njk +4 -4
- data/node_modules/govuk-frontend/govuk/components/table/_index.scss +21 -0
- data/node_modules/govuk-frontend/govuk/components/table/macro-options.json +2 -2
- data/node_modules/govuk-frontend/govuk/objects/_all.scss +1 -0
- data/node_modules/govuk-frontend/govuk/objects/_button-group.scss +94 -0
- data/node_modules/govuk-frontend/package.json +1 -1
- metadata +9 -17
- data/app/assets/images/govuk_publishing_components/chevron-banner/chevron-banner-small-focus.svg +0 -4
- data/app/assets/images/govuk_publishing_components/chevron-banner/chevron-banner-small.svg +0 -4
- data/app/assets/javascripts/govuk_publishing_components/components/header.js +0 -8
- data/app/assets/javascripts/govuk_publishing_components/lib/auto-track-event.js +0 -31
- data/app/assets/stylesheets/govuk_publishing_components/components/_chevron-banner.scss +0 -138
- data/app/assets/stylesheets/govuk_publishing_components/components/_list.scss +0 -1
- data/app/assets/stylesheets/govuk_publishing_components/components/helpers/_variables.scss +0 -27
- data/app/assets/stylesheets/govuk_publishing_components/components/mixins/_back-arrow.scss +0 -13
- data/app/assets/stylesheets/govuk_publishing_components/components/mixins/_clearfix.scss +0 -8
- data/app/views/govuk_publishing_components/components/_chevron_banner.html.erb +0 -19
- data/app/views/govuk_publishing_components/components/_subscription-links.html.erb +0 -85
- data/app/views/govuk_publishing_components/components/_translation-nav.html.erb +0 -33
- data/app/views/govuk_publishing_components/components/docs/chevron_banner.yml +0 -33
- data/app/views/govuk_publishing_components/components/docs/subscription-links.yml +0 -103
- data/app/views/govuk_publishing_components/components/docs/translation-nav.yml +0 -139
@@ -0,0 +1,425 @@
|
|
1
|
+
{
|
2
|
+
"component": "cookie-banner",
|
3
|
+
"fixtures": [
|
4
|
+
{
|
5
|
+
"name": "default",
|
6
|
+
"options": {
|
7
|
+
"messages": [
|
8
|
+
{
|
9
|
+
"headingText": "Cookies on this government service",
|
10
|
+
"text": "We use analytics cookies to help understand how users use our service.",
|
11
|
+
"actions": [
|
12
|
+
{
|
13
|
+
"text": "Accept analytics cookies",
|
14
|
+
"type": "submit",
|
15
|
+
"name": "cookies",
|
16
|
+
"value": "accept"
|
17
|
+
},
|
18
|
+
{
|
19
|
+
"text": "Reject analytics cookies",
|
20
|
+
"type": "submit",
|
21
|
+
"name": "cookies",
|
22
|
+
"value": "reject"
|
23
|
+
},
|
24
|
+
{
|
25
|
+
"text": "View cookie preferences",
|
26
|
+
"href": "/cookie-preferences"
|
27
|
+
}
|
28
|
+
]
|
29
|
+
}
|
30
|
+
]
|
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 \n <a class=\"govuk-link\" href=\"/cookie-preferences\">View cookie preferences</a>\n \n \n </div>\n \n </div>\n \n</div>",
|
33
|
+
"hidden": false
|
34
|
+
},
|
35
|
+
{
|
36
|
+
"name": "accepted confirmation banner",
|
37
|
+
"options": {
|
38
|
+
"messages": [
|
39
|
+
{
|
40
|
+
"text": "Your cookie preferences have been saved. You have accepted cookies.",
|
41
|
+
"role": "alert",
|
42
|
+
"actions": [
|
43
|
+
{
|
44
|
+
"text": "Hide this message",
|
45
|
+
"type": "button"
|
46
|
+
}
|
47
|
+
]
|
48
|
+
}
|
49
|
+
]
|
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>",
|
52
|
+
"hidden": false
|
53
|
+
},
|
54
|
+
{
|
55
|
+
"name": "rejected confirmation banner",
|
56
|
+
"options": {
|
57
|
+
"messages": [
|
58
|
+
{
|
59
|
+
"text": "Your cookie preferences have been saved. You have rejected cookies.",
|
60
|
+
"role": "alert",
|
61
|
+
"actions": [
|
62
|
+
{
|
63
|
+
"text": "Hide this message",
|
64
|
+
"type": "button"
|
65
|
+
}
|
66
|
+
]
|
67
|
+
}
|
68
|
+
]
|
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>",
|
71
|
+
"hidden": false
|
72
|
+
},
|
73
|
+
{
|
74
|
+
"name": "client-side implementation",
|
75
|
+
"options": {
|
76
|
+
"messages": [
|
77
|
+
{
|
78
|
+
"headingText": "Cookies on this service",
|
79
|
+
"text": "We use cookies to help understand how users use our service.",
|
80
|
+
"actions": [
|
81
|
+
{
|
82
|
+
"text": "Accept analytics cookies",
|
83
|
+
"type": "submit",
|
84
|
+
"name": "cookies",
|
85
|
+
"value": "accept"
|
86
|
+
},
|
87
|
+
{
|
88
|
+
"text": "Reject analytics cookies",
|
89
|
+
"type": "submit",
|
90
|
+
"name": "cookies",
|
91
|
+
"value": "reject"
|
92
|
+
},
|
93
|
+
{
|
94
|
+
"text": "View cookie preferences",
|
95
|
+
"href": "/cookie-preferences"
|
96
|
+
}
|
97
|
+
]
|
98
|
+
},
|
99
|
+
{
|
100
|
+
"text": "Your cookie preferences have been saved. You have accepted cookies.",
|
101
|
+
"role": "alert",
|
102
|
+
"hidden": true,
|
103
|
+
"actions": [
|
104
|
+
{
|
105
|
+
"text": "Hide this message",
|
106
|
+
"type": "button"
|
107
|
+
}
|
108
|
+
]
|
109
|
+
},
|
110
|
+
{
|
111
|
+
"text": "Your cookie preferences have been saved. You have rejected cookies.",
|
112
|
+
"role": "alert",
|
113
|
+
"hidden": true,
|
114
|
+
"actions": [
|
115
|
+
{
|
116
|
+
"text": "Hide this message",
|
117
|
+
"type": "button"
|
118
|
+
}
|
119
|
+
]
|
120
|
+
}
|
121
|
+
]
|
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 \n <a class=\"govuk-link\" href=\"/cookie-preferences\">View cookie preferences</a>\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
|
+
"hidden": false
|
125
|
+
},
|
126
|
+
{
|
127
|
+
"name": "heading html",
|
128
|
+
"options": {
|
129
|
+
"messages": [
|
130
|
+
{
|
131
|
+
"headingHtml": "Cookies on <span>my service</span>"
|
132
|
+
}
|
133
|
+
]
|
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>",
|
136
|
+
"hidden": true
|
137
|
+
},
|
138
|
+
{
|
139
|
+
"name": "heading html as text",
|
140
|
+
"options": {
|
141
|
+
"messages": [
|
142
|
+
{
|
143
|
+
"headingText": "Cookies on <span>my service</span>"
|
144
|
+
}
|
145
|
+
]
|
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>",
|
148
|
+
"hidden": true
|
149
|
+
},
|
150
|
+
{
|
151
|
+
"name": "html",
|
152
|
+
"options": {
|
153
|
+
"messages": [
|
154
|
+
{
|
155
|
+
"html": "<p class=\"govuk-body\">We use cookies in <span>our service</span>.</p>"
|
156
|
+
}
|
157
|
+
]
|
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>",
|
160
|
+
"hidden": true
|
161
|
+
},
|
162
|
+
{
|
163
|
+
"name": "classes",
|
164
|
+
"options": {
|
165
|
+
"messages": [
|
166
|
+
{
|
167
|
+
"classes": "app-my-class"
|
168
|
+
}
|
169
|
+
]
|
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>",
|
172
|
+
"hidden": true
|
173
|
+
},
|
174
|
+
{
|
175
|
+
"name": "attributes",
|
176
|
+
"options": {
|
177
|
+
"messages": [
|
178
|
+
{
|
179
|
+
"attributes": {
|
180
|
+
"data-attribute": "my-value"
|
181
|
+
}
|
182
|
+
}
|
183
|
+
]
|
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>",
|
186
|
+
"hidden": true
|
187
|
+
},
|
188
|
+
{
|
189
|
+
"name": "custom aria label",
|
190
|
+
"options": {
|
191
|
+
"ariaLabel": "Cookies on GOV.UK",
|
192
|
+
"messages": [
|
193
|
+
{
|
194
|
+
"text": "We use cookies on GOV.UK"
|
195
|
+
}
|
196
|
+
]
|
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>",
|
199
|
+
"hidden": true
|
200
|
+
},
|
201
|
+
{
|
202
|
+
"name": "hidden",
|
203
|
+
"options": {
|
204
|
+
"messages": [
|
205
|
+
{
|
206
|
+
"hidden": true
|
207
|
+
}
|
208
|
+
]
|
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>",
|
211
|
+
"hidden": true
|
212
|
+
},
|
213
|
+
{
|
214
|
+
"name": "hidden false",
|
215
|
+
"options": {
|
216
|
+
"messages": [
|
217
|
+
{
|
218
|
+
"hidden": false
|
219
|
+
}
|
220
|
+
]
|
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>",
|
223
|
+
"hidden": true
|
224
|
+
},
|
225
|
+
{
|
226
|
+
"name": "default action",
|
227
|
+
"options": {
|
228
|
+
"messages": [
|
229
|
+
{
|
230
|
+
"actions": [
|
231
|
+
{
|
232
|
+
"text": "This is a button"
|
233
|
+
}
|
234
|
+
]
|
235
|
+
}
|
236
|
+
]
|
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>",
|
239
|
+
"hidden": true
|
240
|
+
},
|
241
|
+
{
|
242
|
+
"name": "link",
|
243
|
+
"options": {
|
244
|
+
"messages": [
|
245
|
+
{
|
246
|
+
"actions": [
|
247
|
+
{
|
248
|
+
"text": "This is a link",
|
249
|
+
"href": "/link"
|
250
|
+
}
|
251
|
+
]
|
252
|
+
}
|
253
|
+
]
|
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 \n <a class=\"govuk-link\" href=\"/link\">This is a link</a>\n \n \n </div>\n \n </div>\n \n</div>",
|
256
|
+
"hidden": true
|
257
|
+
},
|
258
|
+
{
|
259
|
+
"name": "link with button options",
|
260
|
+
"options": {
|
261
|
+
"messages": [
|
262
|
+
{
|
263
|
+
"actions": [
|
264
|
+
{
|
265
|
+
"text": "This is a link",
|
266
|
+
"href": "/link",
|
267
|
+
"value": "cookies",
|
268
|
+
"name": "link"
|
269
|
+
}
|
270
|
+
]
|
271
|
+
}
|
272
|
+
]
|
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 \n <a class=\"govuk-link\" href=\"/link\">This is a link</a>\n \n \n </div>\n \n </div>\n \n</div>",
|
275
|
+
"hidden": true
|
276
|
+
},
|
277
|
+
{
|
278
|
+
"name": "type",
|
279
|
+
"options": {
|
280
|
+
"messages": [
|
281
|
+
{
|
282
|
+
"actions": [
|
283
|
+
{
|
284
|
+
"text": "Button",
|
285
|
+
"type": "button"
|
286
|
+
}
|
287
|
+
]
|
288
|
+
}
|
289
|
+
]
|
290
|
+
},
|
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>",
|
292
|
+
"hidden": true
|
293
|
+
},
|
294
|
+
{
|
295
|
+
"name": "button classes",
|
296
|
+
"options": {
|
297
|
+
"messages": [
|
298
|
+
{
|
299
|
+
"actions": [
|
300
|
+
{
|
301
|
+
"text": "Button with custom classes",
|
302
|
+
"classes": "my-button-class app-button-class"
|
303
|
+
}
|
304
|
+
]
|
305
|
+
}
|
306
|
+
]
|
307
|
+
},
|
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>",
|
309
|
+
"hidden": true
|
310
|
+
},
|
311
|
+
{
|
312
|
+
"name": "button attributes",
|
313
|
+
"options": {
|
314
|
+
"messages": [
|
315
|
+
{
|
316
|
+
"actions": [
|
317
|
+
{
|
318
|
+
"text": "Button with attributes",
|
319
|
+
"attributes": {
|
320
|
+
"data-button-attribute": "my-value"
|
321
|
+
}
|
322
|
+
}
|
323
|
+
]
|
324
|
+
}
|
325
|
+
]
|
326
|
+
},
|
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>",
|
328
|
+
"hidden": true
|
329
|
+
},
|
330
|
+
{
|
331
|
+
"name": "link classes",
|
332
|
+
"options": {
|
333
|
+
"messages": [
|
334
|
+
{
|
335
|
+
"actions": [
|
336
|
+
{
|
337
|
+
"text": "Link with custom classes",
|
338
|
+
"href": "/my-link",
|
339
|
+
"classes": "my-link-class app-link-class"
|
340
|
+
}
|
341
|
+
]
|
342
|
+
}
|
343
|
+
]
|
344
|
+
},
|
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 \n \n \n <a class=\"govuk-link my-link-class app-link-class\" href=\"/my-link\">Link with custom classes</a>\n \n \n </div>\n \n </div>\n \n</div>",
|
346
|
+
"hidden": true
|
347
|
+
},
|
348
|
+
{
|
349
|
+
"name": "link attributes",
|
350
|
+
"options": {
|
351
|
+
"messages": [
|
352
|
+
{
|
353
|
+
"actions": [
|
354
|
+
{
|
355
|
+
"text": "Link with attributes",
|
356
|
+
"href": "/link",
|
357
|
+
"attributes": {
|
358
|
+
"data-link-attribute": "my-value"
|
359
|
+
}
|
360
|
+
}
|
361
|
+
]
|
362
|
+
}
|
363
|
+
]
|
364
|
+
},
|
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 \n <a class=\"govuk-link\" href=\"/link\" data-link-attribute=\"my-value\">Link with attributes</a>\n \n \n </div>\n \n </div>\n \n</div>",
|
366
|
+
"hidden": true
|
367
|
+
},
|
368
|
+
{
|
369
|
+
"name": "full banner hidden",
|
370
|
+
"options": {
|
371
|
+
"hidden": true,
|
372
|
+
"classes": "hide-cookie-banner",
|
373
|
+
"attributes": {
|
374
|
+
"data-hide-cookie-banner": "true"
|
375
|
+
},
|
376
|
+
"messages": [
|
377
|
+
{
|
378
|
+
"headingText": "Cookies on this service",
|
379
|
+
"text": "We use cookies to help understand how users use our service.",
|
380
|
+
"actions": [
|
381
|
+
{
|
382
|
+
"text": "Accept analytics cookies",
|
383
|
+
"type": "submit",
|
384
|
+
"name": "cookies",
|
385
|
+
"value": "accept"
|
386
|
+
},
|
387
|
+
{
|
388
|
+
"text": "Reject analytics cookies",
|
389
|
+
"type": "submit",
|
390
|
+
"name": "cookies",
|
391
|
+
"value": "reject"
|
392
|
+
},
|
393
|
+
{
|
394
|
+
"text": "View cookie preferences",
|
395
|
+
"href": "/cookie-preferences"
|
396
|
+
}
|
397
|
+
]
|
398
|
+
},
|
399
|
+
{
|
400
|
+
"text": "Your cookie preferences have been saved. You have accepted cookies.",
|
401
|
+
"role": "alert",
|
402
|
+
"actions": [
|
403
|
+
{
|
404
|
+
"text": "Hide this message",
|
405
|
+
"type": "button"
|
406
|
+
}
|
407
|
+
]
|
408
|
+
},
|
409
|
+
{
|
410
|
+
"text": "Your cookie preferences have been saved. You have rejected cookies.",
|
411
|
+
"role": "alert",
|
412
|
+
"actions": [
|
413
|
+
{
|
414
|
+
"text": "Hide this message",
|
415
|
+
"type": "button"
|
416
|
+
}
|
417
|
+
]
|
418
|
+
}
|
419
|
+
]
|
420
|
+
},
|
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 \n <a class=\"govuk-link\" href=\"/cookie-preferences\">View cookie preferences</a>\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
|
+
"hidden": true
|
423
|
+
}
|
424
|
+
]
|
425
|
+
}
|
@@ -0,0 +1,132 @@
|
|
1
|
+
[
|
2
|
+
{
|
3
|
+
"name": "ariaLabel",
|
4
|
+
"type": "string",
|
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 replacement message. Defaults to \"Cookie banner\"."
|
7
|
+
},
|
8
|
+
{
|
9
|
+
"name": "hidden",
|
10
|
+
"type": "boolean",
|
11
|
+
"required": false,
|
12
|
+
"description": "Defaults to `false`. If you set this option to `true`, the whole cookie banner is hidden, including all messages within the banner. You can use `hidden` for client-side implementations where the cookie banner HTML is present, but hidden until the cookie banner is shown using JavaScript."
|
13
|
+
},
|
14
|
+
{
|
15
|
+
"name": "classes",
|
16
|
+
"type": "string",
|
17
|
+
"required": false,
|
18
|
+
"description": "The additional classes that you want to add to the cookie banner."
|
19
|
+
},
|
20
|
+
{
|
21
|
+
"name": "attributes",
|
22
|
+
"type": "object",
|
23
|
+
"required": false,
|
24
|
+
"description": "The additional attributes that you want to add to the cookie banner. For example, data attributes."
|
25
|
+
},
|
26
|
+
{
|
27
|
+
"name": "messages",
|
28
|
+
"type": "array",
|
29
|
+
"required": true,
|
30
|
+
"description": "The different messages you can pass into the cookie banner. For example, the cookie message and the replacement message.",
|
31
|
+
"params": [
|
32
|
+
{
|
33
|
+
"name": "headingText",
|
34
|
+
"type": "string",
|
35
|
+
"required": false,
|
36
|
+
"description": "The heading text that displays in the message. You can use any string with this option. If you set `headingHtml`, `headingText` is ignored."
|
37
|
+
},
|
38
|
+
{
|
39
|
+
"name": "headingHtml",
|
40
|
+
"type": "string",
|
41
|
+
"required": false,
|
42
|
+
"description": "The heading HTML to use within the message. You can use any string with this option. If you set `headingHtml`, `headingText` is ignored. If you are not passing HTML, use `headingText`."
|
43
|
+
},
|
44
|
+
{
|
45
|
+
"name": "text",
|
46
|
+
"type": "string",
|
47
|
+
"required": true,
|
48
|
+
"description": "The text for the main content within the message. You can use any string with this option. If you set `html`, `text` is not required and is ignored."
|
49
|
+
},
|
50
|
+
{
|
51
|
+
"name": "html",
|
52
|
+
"type": "string",
|
53
|
+
"required": true,
|
54
|
+
"description": "The HTML for the main content within the message. You can use any string with this option. If you set `html`, `text` is not required and is ignored. If you are not passing HTML, use `text`."
|
55
|
+
},
|
56
|
+
{
|
57
|
+
"name": "actions",
|
58
|
+
"type": "array",
|
59
|
+
"required": false,
|
60
|
+
"description": "The buttons and links that you want to display in the message. `actions` defaults to `button` unless you set `href`, which renders the action as a link.",
|
61
|
+
"params": [
|
62
|
+
{
|
63
|
+
"name": "text",
|
64
|
+
"type": "string",
|
65
|
+
"required": true,
|
66
|
+
"description": "The button or link text."
|
67
|
+
},
|
68
|
+
{
|
69
|
+
"name": "type",
|
70
|
+
"type": "string",
|
71
|
+
"required": false,
|
72
|
+
"description": "The type of button. Does not apply if you set `href`, which renders a link. You can choose `button` or `submit`."
|
73
|
+
},
|
74
|
+
{
|
75
|
+
"name": "href",
|
76
|
+
"type": "string",
|
77
|
+
"required": false,
|
78
|
+
"description": "The `href` for a link. If you set `href`, users will see a link instead of a button."
|
79
|
+
},
|
80
|
+
{
|
81
|
+
"name": "name",
|
82
|
+
"type": "string",
|
83
|
+
"required": false,
|
84
|
+
"description": "The name attribute for the button. Does not apply if you set `href`, which makes a link."
|
85
|
+
},
|
86
|
+
{
|
87
|
+
"name": "value",
|
88
|
+
"type": "string",
|
89
|
+
"required": false,
|
90
|
+
"description": "The value attribute for the button. Does not apply if you set `href`, which makes a link."
|
91
|
+
},
|
92
|
+
{
|
93
|
+
"name": "classes",
|
94
|
+
"type": "string",
|
95
|
+
"required": false,
|
96
|
+
"description": "The additional classes that you want to add to the button or link."
|
97
|
+
},
|
98
|
+
{
|
99
|
+
"name": "attributes",
|
100
|
+
"type": "object",
|
101
|
+
"required": false,
|
102
|
+
"description": "The additional attributes that you want to add to the button or link. For example, data attributes."
|
103
|
+
}
|
104
|
+
]
|
105
|
+
},
|
106
|
+
{
|
107
|
+
"name": "hidden",
|
108
|
+
"type": "boolean",
|
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 replacement message HTML is present, but hidden on the page."
|
111
|
+
},
|
112
|
+
{
|
113
|
+
"name": "role",
|
114
|
+
"type": "string",
|
115
|
+
"required": false,
|
116
|
+
"description": "Set `role` to `alert` on replacement messages to allow assistive tech to automatically read the message. You will also need to move focus to the replacement message using JavaScript you have written yourself."
|
117
|
+
},
|
118
|
+
{
|
119
|
+
"name": "classes",
|
120
|
+
"type": "string",
|
121
|
+
"required": false,
|
122
|
+
"description": "The additional classes that you want to add to the message."
|
123
|
+
},
|
124
|
+
{
|
125
|
+
"name": "attributes",
|
126
|
+
"type": "object",
|
127
|
+
"required": false,
|
128
|
+
"description": "The additional attributes that you want to add to the message. For example, data attributes."
|
129
|
+
}
|
130
|
+
]
|
131
|
+
}
|
132
|
+
]
|