govuk_publishing_components 24.10.3 → 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/components/accordion.js +1 -1
- 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/step-by-step-nav.js +2 -2
- data/app/assets/javascripts/govuk_publishing_components/lib/trigger-event.js +1 -1
- data/app/assets/stylesheets/govuk_publishing_components/_all_components_print.scss +0 -11
- 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/_layout_footer.html.erb +2 -2
- data/app/views/govuk_publishing_components/components/_machine_readable_metadata.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_metadata.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_print_link.html.erb +1 -1
- 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/_skip_link.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/_step_by_step_nav.html.erb +2 -2
- data/app/views/govuk_publishing_components/components/_subscription_links.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/layout_header/_navigation_items.html.erb +1 -1
- data/app/views/govuk_publishing_components/components/metadata/_sentence.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 +109 -109
- 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/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/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 +5 -3
|
@@ -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",
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{% from "../button/macro.njk" import govukButton -%}
|
|
2
2
|
|
|
3
|
-
<div class="govuk-cookie-banner {{ params.classes if params.classes }}" role="region" aria-label="{{ params.ariaLabel | default("Cookie banner") }}"
|
|
3
|
+
<div class="govuk-cookie-banner {{ params.classes if params.classes }}" data-nosnippet role="region" aria-label="{{ params.ariaLabel | default("Cookie banner") }}"
|
|
4
4
|
{%- if params.hidden %} hidden{% endif %}
|
|
5
5
|
{%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>
|
|
6
6
|
|
|
@@ -40,11 +40,21 @@
|
|
|
40
40
|
<div class="govuk-button-group">
|
|
41
41
|
{% for action in message.actions %}
|
|
42
42
|
{% if action.href %}
|
|
43
|
-
{%
|
|
44
|
-
|
|
45
|
-
|
|
43
|
+
{% if action.type == "button" %}
|
|
44
|
+
{{ govukButton({
|
|
45
|
+
"text": action.text,
|
|
46
|
+
"type": "button",
|
|
47
|
+
"classes": action.classes,
|
|
48
|
+
"href": action.href,
|
|
49
|
+
"attributes": action.attributes
|
|
50
|
+
}) | indent(12) | trim }}
|
|
51
|
+
{% else %}
|
|
52
|
+
{% set linkClasses = "govuk-link" %}
|
|
53
|
+
{% if action.classes %}
|
|
54
|
+
{% set linkClasses = linkClasses + " " + action.classes %}
|
|
55
|
+
{% endif %}
|
|
56
|
+
<a class="{{ linkClasses }}" href="{{ action.href }}" {%- for attribute, value in action.attributes %} {{attribute}}="{{value}}"{% endfor %}>{{ action.text }}</a>
|
|
46
57
|
{% endif %}
|
|
47
|
-
<a class="{{ linkClasses }}" href="{{ action.href }}" {%- for attribute, value in action.attributes %} {{attribute}}="{{value}}"{% endfor %}>{{ action.text }}</a>
|
|
48
58
|
{% else %}
|
|
49
59
|
{{ govukButton({
|
|
50
60
|
"text": action.text,
|
|
@@ -91,7 +91,7 @@
|
|
|
91
91
|
"name": "classes",
|
|
92
92
|
"type": "string",
|
|
93
93
|
"required": false,
|
|
94
|
-
"description": "Classes to add to the form group (
|
|
94
|
+
"description": "Classes to add to the form group (for example to show error state for the whole group)"
|
|
95
95
|
}
|
|
96
96
|
]
|
|
97
97
|
},
|
|
@@ -99,7 +99,7 @@
|
|
|
99
99
|
"name": "fieldset",
|
|
100
100
|
"type": "object",
|
|
101
101
|
"required": false,
|
|
102
|
-
"description": "Options for the fieldset component (
|
|
102
|
+
"description": "Options for the fieldset component (for example legend).",
|
|
103
103
|
"isComponent": true
|
|
104
104
|
},
|
|
105
105
|
{
|
|
@@ -34,7 +34,11 @@
|
|
|
34
34
|
|
|
35
35
|
// ...but only underline the text, not the arrow
|
|
36
36
|
.govuk-details__summary-text {
|
|
37
|
-
|
|
37
|
+
@include govuk-link-decoration;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.govuk-details__summary:hover .govuk-details__summary-text {
|
|
41
|
+
@include govuk-link-hover-decoration;
|
|
38
42
|
}
|
|
39
43
|
|
|
40
44
|
// Remove the underline when focussed to avoid duplicate borders
|
|
@@ -8,17 +8,21 @@
|
|
|
8
8
|
.govuk-file-upload {
|
|
9
9
|
@include govuk-font($size: 19);
|
|
10
10
|
@include govuk-text-colour;
|
|
11
|
-
|
|
12
|
-
padding
|
|
11
|
+
margin-left: -$component-padding;
|
|
12
|
+
padding: $component-padding;
|
|
13
|
+
|
|
14
|
+
// The default file upload button in Safari does not
|
|
15
|
+
// support setting a custom font-size. Set `-webkit-appearance`
|
|
16
|
+
// to `button` to drop out of the native appearance so the
|
|
17
|
+
// font-size is set to 19px
|
|
18
|
+
// https://bugs.webkit.org/show_bug.cgi?id=224746
|
|
19
|
+
&::-webkit-file-upload-button {
|
|
20
|
+
-webkit-appearance: button;
|
|
21
|
+
color: inherit;
|
|
22
|
+
font: inherit;
|
|
23
|
+
}
|
|
13
24
|
|
|
14
25
|
&:focus {
|
|
15
|
-
// "Yank" the padding with negative margin to avoid a jump
|
|
16
|
-
// when element is focused
|
|
17
|
-
margin-right: -$component-padding;
|
|
18
|
-
margin-left: -$component-padding;
|
|
19
|
-
padding-right: $component-padding;
|
|
20
|
-
padding-left: $component-padding;
|
|
21
|
-
|
|
22
26
|
outline: $govuk-focus-width solid $govuk-focus-colour;
|
|
23
27
|
// Use `box-shadow` to add border instead of changing `border-width`
|
|
24
28
|
// (which changes element size) and since `outline` is already used for the
|
|
@@ -37,11 +41,6 @@
|
|
|
37
41
|
// to recognise `focus-within` and don't set any styles from the block
|
|
38
42
|
// when it's a selector.
|
|
39
43
|
&:focus-within {
|
|
40
|
-
margin-right: -$component-padding;
|
|
41
|
-
margin-left: -$component-padding;
|
|
42
|
-
padding-right: $component-padding;
|
|
43
|
-
padding-left: $component-padding;
|
|
44
|
-
|
|
45
44
|
outline: $govuk-focus-width solid $govuk-focus-colour;
|
|
46
45
|
|
|
47
46
|
box-shadow: inset 0 0 0 4px $govuk-input-border-colour;
|