govuk_publishing_components 23.3.0 → 23.7.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/copy-to-clipboard.js +16 -14
- data/app/assets/javascripts/govuk_publishing_components/components/details.js +38 -34
- data/app/assets/javascripts/govuk_publishing_components/components/print-link.js +8 -7
- data/app/assets/javascripts/govuk_publishing_components/lib/govspeak/magna-charta.js +10 -9
- data/app/assets/javascripts/govuk_publishing_components/lib/initial-focus.js +13 -0
- data/app/assets/stylesheets/govuk_publishing_components/_all_components.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/_contextual-sidebar.scss +2 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/_image-card.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/_input.scss +0 -46
- data/app/assets/stylesheets/govuk_publishing_components/components/_transition-countdown.scss +125 -0
- data/app/views/govuk_publishing_components/component_guide/show.html.erb +1 -2
- data/app/views/govuk_publishing_components/components/_attachment.html.erb +5 -4
- data/app/views/govuk_publishing_components/components/_contextual_sidebar.html.erb +14 -1
- data/app/views/govuk_publishing_components/components/_input.html.erb +6 -6
- data/app/views/govuk_publishing_components/components/_transition_countdown.html.erb +34 -0
- data/app/views/govuk_publishing_components/components/contextual_sidebar/_brexit_cta.html.erb +5 -3
- data/app/views/govuk_publishing_components/components/docs/attachment.yml +10 -0
- data/app/views/govuk_publishing_components/components/docs/contextual_sidebar.yml +0 -1
- data/app/views/govuk_publishing_components/components/docs/govspeak.yml +55 -0
- data/app/views/govuk_publishing_components/components/docs/transition_countdown.yml +17 -0
- data/config/locales/cy.yml +9 -1
- data/config/locales/en.yml +7 -0
- data/lib/govuk_publishing_components.rb +1 -0
- data/lib/govuk_publishing_components/app_helpers/countdown_helper.rb +33 -0
- data/lib/govuk_publishing_components/version.rb +1 -1
- data/node_modules/govuk-frontend/govuk/all.js +31 -37
- data/node_modules/govuk-frontend/govuk/components/accordion/README.md +1 -1
- data/node_modules/govuk-frontend/govuk/components/accordion/_index.scss +0 -1
- data/node_modules/govuk-frontend/govuk/components/accordion/fixtures.json +235 -0
- data/node_modules/govuk-frontend/govuk/components/back-link/_index.scss +0 -2
- data/node_modules/govuk-frontend/govuk/components/back-link/fixtures.json +56 -0
- data/node_modules/govuk-frontend/govuk/components/breadcrumbs/_index.scss +0 -1
- data/node_modules/govuk-frontend/govuk/components/breadcrumbs/fixtures.json +172 -0
- data/node_modules/govuk-frontend/govuk/components/button/_index.scss +3 -3
- data/node_modules/govuk-frontend/govuk/components/button/fixtures.json +275 -0
- data/node_modules/govuk-frontend/govuk/components/character-count/fixtures.json +170 -0
- data/node_modules/govuk-frontend/govuk/components/checkboxes/_index.scss +13 -13
- data/node_modules/govuk-frontend/govuk/components/checkboxes/fixtures.json +1015 -0
- data/node_modules/govuk-frontend/govuk/components/date-input/fixtures.json +499 -0
- data/node_modules/govuk-frontend/govuk/components/details/_index.scss +0 -1
- data/node_modules/govuk-frontend/govuk/components/details/fixtures.json +83 -0
- data/node_modules/govuk-frontend/govuk/components/error-message/fixtures.json +66 -0
- data/node_modules/govuk-frontend/govuk/components/error-summary/_index.scss +0 -2
- data/node_modules/govuk-frontend/govuk/components/error-summary/fixtures.json +181 -0
- data/node_modules/govuk-frontend/govuk/components/fieldset/_index.scss +1 -1
- data/node_modules/govuk-frontend/govuk/components/fieldset/fixtures.json +93 -0
- data/node_modules/govuk-frontend/govuk/components/fieldset/macro-options.json +6 -0
- data/node_modules/govuk-frontend/govuk/components/fieldset/template.njk +5 -1
- data/node_modules/govuk-frontend/govuk/components/file-upload/fixtures.json +151 -0
- data/node_modules/govuk-frontend/govuk/components/footer/_index.scss +0 -1
- data/node_modules/govuk-frontend/govuk/components/footer/fixtures.json +482 -0
- data/node_modules/govuk-frontend/govuk/components/header/_index.scss +2 -5
- data/node_modules/govuk-frontend/govuk/components/header/fixtures.json +360 -0
- data/node_modules/govuk-frontend/govuk/components/header/header.js +665 -316
- data/node_modules/govuk-frontend/govuk/components/header/macro-options.json +13 -1
- data/node_modules/govuk-frontend/govuk/components/header/template.njk +9 -5
- data/node_modules/govuk-frontend/govuk/components/hint/_index.scss +0 -2
- data/node_modules/govuk-frontend/govuk/components/hint/fixtures.json +50 -0
- data/node_modules/govuk-frontend/govuk/components/hint/macro-options.json +1 -1
- data/node_modules/govuk-frontend/govuk/components/input/_index.scss +91 -0
- data/node_modules/govuk-frontend/govuk/components/input/fixtures.json +538 -0
- data/node_modules/govuk-frontend/govuk/components/input/macro-options.json +64 -0
- data/node_modules/govuk-frontend/govuk/components/input/template.njk +17 -0
- data/node_modules/govuk-frontend/govuk/components/inset-text/fixtures.json +49 -0
- data/node_modules/govuk-frontend/govuk/components/label/fixtures.json +75 -0
- data/node_modules/govuk-frontend/govuk/components/panel/_index.scss +6 -2
- data/node_modules/govuk-frontend/govuk/components/panel/fixtures.json +74 -0
- data/node_modules/govuk-frontend/govuk/components/phase-banner/fixtures.json +65 -0
- data/node_modules/govuk-frontend/govuk/components/radios/_index.scss +13 -13
- data/node_modules/govuk-frontend/govuk/components/radios/fixtures.json +1066 -0
- data/node_modules/govuk-frontend/govuk/components/radios/macro-options.json +2 -2
- data/node_modules/govuk-frontend/govuk/components/select/_index.scss +0 -1
- data/node_modules/govuk-frontend/govuk/components/select/fixtures.json +248 -0
- data/node_modules/govuk-frontend/govuk/components/skip-link/fixtures.json +72 -0
- data/node_modules/govuk-frontend/govuk/components/summary-list/README.md +1 -1
- data/node_modules/govuk-frontend/govuk/components/summary-list/_index.scss +2 -10
- data/node_modules/govuk-frontend/govuk/components/summary-list/fixtures.json +991 -0
- data/node_modules/govuk-frontend/govuk/components/table/fixtures.json +468 -0
- data/node_modules/govuk-frontend/govuk/components/tabs/_index.scss +3 -6
- data/node_modules/govuk-frontend/govuk/components/tabs/fixtures.json +229 -0
- data/node_modules/govuk-frontend/govuk/components/tag/_index.scss +0 -1
- data/node_modules/govuk-frontend/govuk/components/tag/fixtures.json +117 -0
- data/node_modules/govuk-frontend/govuk/components/textarea/_index.scss +0 -1
- data/node_modules/govuk-frontend/govuk/components/textarea/fixtures.json +199 -0
- data/node_modules/govuk-frontend/govuk/components/warning-text/_index.scss +0 -1
- data/node_modules/govuk-frontend/govuk/components/warning-text/fixtures.json +68 -0
- data/node_modules/govuk-frontend/govuk/helpers/_device-pixels.scss +3 -3
- data/node_modules/govuk-frontend/govuk/helpers/_font-faces.scss +9 -11
- data/node_modules/govuk-frontend/govuk/helpers/_links.scss +1 -3
- data/node_modules/govuk-frontend/govuk/helpers/_media-queries.scss +1 -5
- data/node_modules/govuk-frontend/govuk/helpers/_spacing.scss +2 -1
- data/node_modules/govuk-frontend/govuk/helpers/_typography.scss +7 -6
- data/node_modules/govuk-frontend/govuk/objects/_form-group.scss +0 -1
- data/node_modules/govuk-frontend/govuk/objects/_grid.scss +2 -3
- data/node_modules/govuk-frontend/govuk/objects/_main-wrapper.scss +0 -1
- data/node_modules/govuk-frontend/govuk/overrides/_display.scss +1 -1
- data/node_modules/govuk-frontend/govuk/overrides/_width.scss +1 -0
- data/node_modules/govuk-frontend/govuk/settings/_colours-applied.scss +0 -3
- data/node_modules/govuk-frontend/govuk/settings/_colours-organisations.scss +3 -0
- data/node_modules/govuk-frontend/govuk/settings/_colours-palette.scss +9 -2
- data/node_modules/govuk-frontend/govuk/settings/_compatibility.scss +0 -1
- data/node_modules/govuk-frontend/govuk/settings/_measurements.scss +0 -4
- data/node_modules/govuk-frontend/govuk/settings/_typography-font-families.scss +2 -2
- data/node_modules/govuk-frontend/govuk/settings/_typography-font.scss +11 -5
- data/node_modules/govuk-frontend/govuk/settings/_typography-responsive.scss +6 -2
- data/node_modules/govuk-frontend/govuk/tools/_font-url.scss +0 -3
- data/node_modules/govuk-frontend/govuk/tools/_image-url.scss +0 -3
- data/node_modules/govuk-frontend/govuk/utilities/_visually-hidden.scss +0 -1
- data/node_modules/govuk-frontend/govuk/vendor/_sass-mq.scss +0 -4
- data/node_modules/govuk-frontend/package.json +1 -1
- metadata +36 -3
- data/app/assets/javascripts/govuk_publishing_components/components/initial-focus.js +0 -12
@@ -0,0 +1,56 @@
|
|
1
|
+
{
|
2
|
+
"component": "back-link",
|
3
|
+
"fixtures": [
|
4
|
+
{
|
5
|
+
"name": "default",
|
6
|
+
"options": {
|
7
|
+
"href": "#"
|
8
|
+
},
|
9
|
+
"html": "<a href=\"#\" class=\"govuk-back-link\">Back</a>"
|
10
|
+
},
|
11
|
+
{
|
12
|
+
"name": "with custom text",
|
13
|
+
"options": {
|
14
|
+
"href": "#",
|
15
|
+
"text": "Back to home"
|
16
|
+
},
|
17
|
+
"html": "<a href=\"#\" class=\"govuk-back-link\">Back to home</a>"
|
18
|
+
},
|
19
|
+
{
|
20
|
+
"name": "classes",
|
21
|
+
"options": {
|
22
|
+
"classes": "app-back-link--custom-class",
|
23
|
+
"href": "#"
|
24
|
+
},
|
25
|
+
"html": "<a href=\"#\" class=\"govuk-back-link app-back-link--custom-class\">Back</a>"
|
26
|
+
},
|
27
|
+
{
|
28
|
+
"name": "html as text",
|
29
|
+
"options": {
|
30
|
+
"text": "<b>Home</b>",
|
31
|
+
"href": "#"
|
32
|
+
},
|
33
|
+
"html": "<a href=\"#\" class=\"govuk-back-link\"><b>Home</b></a>"
|
34
|
+
},
|
35
|
+
{
|
36
|
+
"name": "html",
|
37
|
+
"options": {
|
38
|
+
"html": "<b>Back</b>",
|
39
|
+
"href": "#"
|
40
|
+
},
|
41
|
+
"html": "<a href=\"#\" class=\"govuk-back-link\"><b>Back</b></a>"
|
42
|
+
},
|
43
|
+
{
|
44
|
+
"name": "attributes",
|
45
|
+
"options": {
|
46
|
+
"href": "#",
|
47
|
+
"html": "<b>Back to home</b>",
|
48
|
+
"attributes": {
|
49
|
+
"data-test": "attribute",
|
50
|
+
"aria-label": "Back to home"
|
51
|
+
}
|
52
|
+
},
|
53
|
+
"html": "<a href=\"#\" class=\"govuk-back-link\" data-test=\"attribute\" aria-label=\"Back to home\"><b>Back to home</b></a>"
|
54
|
+
}
|
55
|
+
]
|
56
|
+
}
|
@@ -0,0 +1,172 @@
|
|
1
|
+
{
|
2
|
+
"component": "breadcrumbs",
|
3
|
+
"fixtures": [
|
4
|
+
{
|
5
|
+
"name": "default",
|
6
|
+
"options": {
|
7
|
+
"items": [
|
8
|
+
{
|
9
|
+
"text": "Section",
|
10
|
+
"href": "/section"
|
11
|
+
},
|
12
|
+
{
|
13
|
+
"text": "Sub-section",
|
14
|
+
"href": "/section/sub-section"
|
15
|
+
}
|
16
|
+
]
|
17
|
+
},
|
18
|
+
"html": "<div class=\"govuk-breadcrumbs \">\n <ol class=\"govuk-breadcrumbs__list\">\n \n \n <li class=\"govuk-breadcrumbs__list-item\">\n <a class=\"govuk-breadcrumbs__link\" href=\"/section\">Section</a>\n </li>\n \n \n \n <li class=\"govuk-breadcrumbs__list-item\">\n <a class=\"govuk-breadcrumbs__link\" href=\"/section/sub-section\">Sub-section</a>\n </li>\n \n \n </ol>\n</div>"
|
19
|
+
},
|
20
|
+
{
|
21
|
+
"name": "with one level",
|
22
|
+
"options": {
|
23
|
+
"items": [
|
24
|
+
{
|
25
|
+
"text": "Section",
|
26
|
+
"href": "/section"
|
27
|
+
}
|
28
|
+
]
|
29
|
+
},
|
30
|
+
"html": "<div class=\"govuk-breadcrumbs \">\n <ol class=\"govuk-breadcrumbs__list\">\n \n \n <li class=\"govuk-breadcrumbs__list-item\">\n <a class=\"govuk-breadcrumbs__link\" href=\"/section\">Section</a>\n </li>\n \n \n </ol>\n</div>"
|
31
|
+
},
|
32
|
+
{
|
33
|
+
"name": "with multiple levels",
|
34
|
+
"options": {
|
35
|
+
"items": [
|
36
|
+
{
|
37
|
+
"text": "Home",
|
38
|
+
"href": "/"
|
39
|
+
},
|
40
|
+
{
|
41
|
+
"text": "Section",
|
42
|
+
"href": "/section"
|
43
|
+
},
|
44
|
+
{
|
45
|
+
"text": "Sub-section",
|
46
|
+
"href": "/section/sub-section"
|
47
|
+
},
|
48
|
+
{
|
49
|
+
"text": "Sub Sub-section",
|
50
|
+
"href": "/section/sub-section/sub-sub-section"
|
51
|
+
}
|
52
|
+
]
|
53
|
+
},
|
54
|
+
"html": "<div class=\"govuk-breadcrumbs \">\n <ol class=\"govuk-breadcrumbs__list\">\n \n \n <li class=\"govuk-breadcrumbs__list-item\">\n <a class=\"govuk-breadcrumbs__link\" href=\"/\">Home</a>\n </li>\n \n \n \n <li class=\"govuk-breadcrumbs__list-item\">\n <a class=\"govuk-breadcrumbs__link\" href=\"/section\">Section</a>\n </li>\n \n \n \n <li class=\"govuk-breadcrumbs__list-item\">\n <a class=\"govuk-breadcrumbs__link\" href=\"/section/sub-section\">Sub-section</a>\n </li>\n \n \n \n <li class=\"govuk-breadcrumbs__list-item\">\n <a class=\"govuk-breadcrumbs__link\" href=\"/section/sub-section/sub-sub-section\">Sub Sub-section</a>\n </li>\n \n \n </ol>\n</div>"
|
55
|
+
},
|
56
|
+
{
|
57
|
+
"name": "without the home section",
|
58
|
+
"options": {
|
59
|
+
"items": [
|
60
|
+
{
|
61
|
+
"text": "Service Manual",
|
62
|
+
"href": "/service-manual"
|
63
|
+
},
|
64
|
+
{
|
65
|
+
"text": "Agile Delivery",
|
66
|
+
"href": "/service-manual/agile-delivery"
|
67
|
+
}
|
68
|
+
]
|
69
|
+
},
|
70
|
+
"html": "<div class=\"govuk-breadcrumbs \">\n <ol class=\"govuk-breadcrumbs__list\">\n \n \n <li class=\"govuk-breadcrumbs__list-item\">\n <a class=\"govuk-breadcrumbs__link\" href=\"/service-manual\">Service Manual</a>\n </li>\n \n \n \n <li class=\"govuk-breadcrumbs__list-item\">\n <a class=\"govuk-breadcrumbs__link\" href=\"/service-manual/agile-delivery\">Agile Delivery</a>\n </li>\n \n \n </ol>\n</div>"
|
71
|
+
},
|
72
|
+
{
|
73
|
+
"name": "with last breadcrumb as current page",
|
74
|
+
"options": {
|
75
|
+
"items": [
|
76
|
+
{
|
77
|
+
"text": "Home",
|
78
|
+
"href": "/"
|
79
|
+
},
|
80
|
+
{
|
81
|
+
"text": "Passports, travel and living abroad",
|
82
|
+
"href": "/browse/abroad"
|
83
|
+
},
|
84
|
+
{
|
85
|
+
"text": "Travel abroad"
|
86
|
+
}
|
87
|
+
]
|
88
|
+
},
|
89
|
+
"html": "<div class=\"govuk-breadcrumbs \">\n <ol class=\"govuk-breadcrumbs__list\">\n \n \n <li class=\"govuk-breadcrumbs__list-item\">\n <a class=\"govuk-breadcrumbs__link\" href=\"/\">Home</a>\n </li>\n \n \n \n <li class=\"govuk-breadcrumbs__list-item\">\n <a class=\"govuk-breadcrumbs__link\" href=\"/browse/abroad\">Passports, travel and living abroad</a>\n </li>\n \n \n \n <li class=\"govuk-breadcrumbs__list-item\" aria-current=\"page\">Travel abroad</li>\n \n \n </ol>\n</div>"
|
90
|
+
},
|
91
|
+
{
|
92
|
+
"name": "with collapse on mobile",
|
93
|
+
"options": {
|
94
|
+
"collapseOnMobile": true,
|
95
|
+
"items": [
|
96
|
+
{
|
97
|
+
"text": "Home",
|
98
|
+
"href": "/"
|
99
|
+
},
|
100
|
+
{
|
101
|
+
"text": "Education, training and skills",
|
102
|
+
"href": "/education"
|
103
|
+
},
|
104
|
+
{
|
105
|
+
"text": "Special educational needs and disability (SEND) and high needs",
|
106
|
+
"href": "/education/special-educational-needs-and-disability-send-and-high-needs"
|
107
|
+
}
|
108
|
+
]
|
109
|
+
},
|
110
|
+
"html": "<div class=\"govuk-breadcrumbs govuk-breadcrumbs--collapse-on-mobile\">\n <ol class=\"govuk-breadcrumbs__list\">\n \n \n <li class=\"govuk-breadcrumbs__list-item\">\n <a class=\"govuk-breadcrumbs__link\" href=\"/\">Home</a>\n </li>\n \n \n \n <li class=\"govuk-breadcrumbs__list-item\">\n <a class=\"govuk-breadcrumbs__link\" href=\"/education\">Education, training and skills</a>\n </li>\n \n \n \n <li class=\"govuk-breadcrumbs__list-item\">\n <a class=\"govuk-breadcrumbs__link\" href=\"/education/special-educational-needs-and-disability-send-and-high-needs\">Special educational needs and disability (SEND) and high needs</a>\n </li>\n \n \n </ol>\n</div>"
|
111
|
+
},
|
112
|
+
{
|
113
|
+
"name": "classes",
|
114
|
+
"options": {
|
115
|
+
"classes": "app-breadcrumbs--custom-modifier"
|
116
|
+
},
|
117
|
+
"html": "<div class=\"govuk-breadcrumbs app-breadcrumbs--custom-modifier\">\n <ol class=\"govuk-breadcrumbs__list\">\n \n </ol>\n</div>"
|
118
|
+
},
|
119
|
+
{
|
120
|
+
"name": "attributes",
|
121
|
+
"options": {
|
122
|
+
"attributes": {
|
123
|
+
"id": "my-navigation",
|
124
|
+
"role": "navigation"
|
125
|
+
}
|
126
|
+
},
|
127
|
+
"html": "<div class=\"govuk-breadcrumbs \" id=\"my-navigation\" role=\"navigation\">\n <ol class=\"govuk-breadcrumbs__list\">\n \n </ol>\n</div>"
|
128
|
+
},
|
129
|
+
{
|
130
|
+
"name": "item attributes",
|
131
|
+
"options": {
|
132
|
+
"items": [
|
133
|
+
{
|
134
|
+
"text": "Section 1",
|
135
|
+
"href": "/section",
|
136
|
+
"attributes": {
|
137
|
+
"data-attribute": "my-attribute",
|
138
|
+
"data-attribute-2": "my-attribute-2"
|
139
|
+
}
|
140
|
+
}
|
141
|
+
]
|
142
|
+
},
|
143
|
+
"html": "<div class=\"govuk-breadcrumbs \">\n <ol class=\"govuk-breadcrumbs__list\">\n \n \n <li class=\"govuk-breadcrumbs__list-item\">\n <a class=\"govuk-breadcrumbs__link\" href=\"/section\" data-attribute=\"my-attribute\" data-attribute-2=\"my-attribute-2\">Section 1</a>\n </li>\n \n \n </ol>\n</div>"
|
144
|
+
},
|
145
|
+
{
|
146
|
+
"name": "html as text",
|
147
|
+
"options": {
|
148
|
+
"items": [
|
149
|
+
{
|
150
|
+
"text": "<span>Section 1</span>"
|
151
|
+
}
|
152
|
+
]
|
153
|
+
},
|
154
|
+
"html": "<div class=\"govuk-breadcrumbs \">\n <ol class=\"govuk-breadcrumbs__list\">\n \n \n <li class=\"govuk-breadcrumbs__list-item\" aria-current=\"page\"><span>Section 1</span></li>\n \n \n </ol>\n</div>"
|
155
|
+
},
|
156
|
+
{
|
157
|
+
"name": "html",
|
158
|
+
"options": {
|
159
|
+
"items": [
|
160
|
+
{
|
161
|
+
"html": "<em>Section 1</em>"
|
162
|
+
},
|
163
|
+
{
|
164
|
+
"html": "<em>Section 2</em>",
|
165
|
+
"href": "/section-2"
|
166
|
+
}
|
167
|
+
]
|
168
|
+
},
|
169
|
+
"html": "<div class=\"govuk-breadcrumbs \">\n <ol class=\"govuk-breadcrumbs__list\">\n \n \n <li class=\"govuk-breadcrumbs__list-item\" aria-current=\"page\"><em>Section 1</em></li>\n \n \n \n <li class=\"govuk-breadcrumbs__list-item\">\n <a class=\"govuk-breadcrumbs__link\" href=\"/section-2\"><em>Section 2</em></a>\n </li>\n \n \n </ol>\n</div>"
|
170
|
+
}
|
171
|
+
]
|
172
|
+
}
|
@@ -1,5 +1,5 @@
|
|
1
1
|
@include govuk-exports("govuk/component/button") {
|
2
|
-
$govuk-button-colour: govuk-colour("green", $legacy: #00823b);
|
2
|
+
$govuk-button-colour: govuk-colour("green", $legacy: #00823b);
|
3
3
|
$govuk-button-hover-colour: govuk-shade($govuk-button-colour, 20%);
|
4
4
|
$govuk-button-shadow-colour: govuk-shade($govuk-button-colour, 60%);
|
5
5
|
$govuk-button-text-colour: govuk-colour("white");
|
@@ -117,7 +117,7 @@
|
|
117
117
|
|
118
118
|
// Use a pseudo element to expand the click target area to include the
|
119
119
|
// button's shadow as well, in case users try to click it.
|
120
|
-
|
120
|
+
&:before {
|
121
121
|
content: "";
|
122
122
|
display: block;
|
123
123
|
|
@@ -141,7 +141,7 @@
|
|
141
141
|
// the click event is still fired.
|
142
142
|
//
|
143
143
|
// 🎉
|
144
|
-
&:active
|
144
|
+
&:active:before {
|
145
145
|
top: -($govuk-border-width-form-element + $button-shadow-size);
|
146
146
|
}
|
147
147
|
}
|
@@ -0,0 +1,275 @@
|
|
1
|
+
{
|
2
|
+
"component": "button",
|
3
|
+
"fixtures": [
|
4
|
+
{
|
5
|
+
"name": "default",
|
6
|
+
"options": {
|
7
|
+
"text": "Save and continue"
|
8
|
+
},
|
9
|
+
"html": "<button class=\"govuk-button\" data-module=\"govuk-button\">\n Save and continue\n</button>"
|
10
|
+
},
|
11
|
+
{
|
12
|
+
"name": "disabled",
|
13
|
+
"options": {
|
14
|
+
"text": "Disabled button",
|
15
|
+
"disabled": true
|
16
|
+
},
|
17
|
+
"html": "<button disabled=\"disabled\" aria-disabled=\"true\" class=\"govuk-button govuk-button--disabled\" data-module=\"govuk-button\">\n Disabled button\n</button>"
|
18
|
+
},
|
19
|
+
{
|
20
|
+
"name": "link",
|
21
|
+
"options": {
|
22
|
+
"text": "Link button",
|
23
|
+
"href": "/"
|
24
|
+
},
|
25
|
+
"html": "<a href=\"/\" role=\"button\" draggable=\"false\" class=\"govuk-button\" data-module=\"govuk-button\">\n Link button\n</a>"
|
26
|
+
},
|
27
|
+
{
|
28
|
+
"name": "link disabled",
|
29
|
+
"options": {
|
30
|
+
"text": "Disabled link button",
|
31
|
+
"href": "/",
|
32
|
+
"disabled": true
|
33
|
+
},
|
34
|
+
"html": "<a href=\"/\" role=\"button\" draggable=\"false\" class=\"govuk-button govuk-button--disabled\" data-module=\"govuk-button\">\n Disabled link button\n</a>"
|
35
|
+
},
|
36
|
+
{
|
37
|
+
"name": "start link",
|
38
|
+
"options": {
|
39
|
+
"text": "Start now link button",
|
40
|
+
"href": "/",
|
41
|
+
"isStartButton": true
|
42
|
+
},
|
43
|
+
"html": "<a href=\"/\" role=\"button\" draggable=\"false\" class=\"govuk-button govuk-button--start\" data-module=\"govuk-button\">\n Start now link button\n <svg class=\"govuk-button__start-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"17.5\" height=\"19\" viewBox=\"0 0 33 40\" aria-hidden=\"true\" focusable=\"false\">\n <path fill=\"currentColor\" d=\"M0 0h13l20 20-20 20H0l20-20z\"/>\n </svg></a>"
|
44
|
+
},
|
45
|
+
{
|
46
|
+
"name": "input",
|
47
|
+
"options": {
|
48
|
+
"element": "input",
|
49
|
+
"name": "start-now",
|
50
|
+
"text": "Start now"
|
51
|
+
},
|
52
|
+
"html": "<input value=\"Start now\" type=\"submit\" name=\"start-now\" class=\"govuk-button\" data-module=\"govuk-button\">"
|
53
|
+
},
|
54
|
+
{
|
55
|
+
"name": "input disabled",
|
56
|
+
"options": {
|
57
|
+
"element": "input",
|
58
|
+
"text": "Explicit input button disabled",
|
59
|
+
"disabled": true
|
60
|
+
},
|
61
|
+
"html": "<input value=\"Explicit input button disabled\" type=\"submit\" disabled=\"disabled\" aria-disabled=\"true\" class=\"govuk-button govuk-button--disabled\" data-module=\"govuk-button\">"
|
62
|
+
},
|
63
|
+
{
|
64
|
+
"name": "prevent double click",
|
65
|
+
"options": {
|
66
|
+
"text": "Submit",
|
67
|
+
"preventDoubleClick": true
|
68
|
+
},
|
69
|
+
"html": "<button data-prevent-double-click=\"true\" class=\"govuk-button\" data-module=\"govuk-button\">\n Submit\n</button>"
|
70
|
+
},
|
71
|
+
{
|
72
|
+
"name": "with active state",
|
73
|
+
"options": {
|
74
|
+
"name": "active",
|
75
|
+
"text": "Active",
|
76
|
+
"classes": ":active"
|
77
|
+
},
|
78
|
+
"html": "<button name=\"active\" class=\"govuk-button :active\" data-module=\"govuk-button\">\n Active\n</button>"
|
79
|
+
},
|
80
|
+
{
|
81
|
+
"name": "with hover state",
|
82
|
+
"options": {
|
83
|
+
"name": "hover",
|
84
|
+
"text": "Hovered",
|
85
|
+
"classes": ":hover"
|
86
|
+
},
|
87
|
+
"html": "<button name=\"hover\" class=\"govuk-button :hover\" data-module=\"govuk-button\">\n Hovered\n</button>"
|
88
|
+
},
|
89
|
+
{
|
90
|
+
"name": "with focus state",
|
91
|
+
"options": {
|
92
|
+
"name": "focus",
|
93
|
+
"text": "Focussed",
|
94
|
+
"classes": ":focus"
|
95
|
+
},
|
96
|
+
"html": "<button name=\"focus\" class=\"govuk-button :focus\" data-module=\"govuk-button\">\n Focussed\n</button>"
|
97
|
+
},
|
98
|
+
{
|
99
|
+
"name": "Secondary",
|
100
|
+
"options": {
|
101
|
+
"name": "secondary",
|
102
|
+
"text": "Secondary button",
|
103
|
+
"classes": "govuk-button--secondary"
|
104
|
+
},
|
105
|
+
"html": "<button name=\"secondary\" class=\"govuk-button govuk-button--secondary\" data-module=\"govuk-button\">\n Secondary button\n</button>"
|
106
|
+
},
|
107
|
+
{
|
108
|
+
"name": "Secondary disabled",
|
109
|
+
"options": {
|
110
|
+
"name": "secondary",
|
111
|
+
"text": "Secondary button disabled",
|
112
|
+
"classes": "govuk-button--secondary",
|
113
|
+
"disabled": true
|
114
|
+
},
|
115
|
+
"html": "<button name=\"secondary\" disabled=\"disabled\" aria-disabled=\"true\" class=\"govuk-button govuk-button--secondary govuk-button--disabled\" data-module=\"govuk-button\">\n Secondary button disabled\n</button>"
|
116
|
+
},
|
117
|
+
{
|
118
|
+
"name": "Secondary link",
|
119
|
+
"options": {
|
120
|
+
"name": "secondary",
|
121
|
+
"text": "Secondary button",
|
122
|
+
"href": "/",
|
123
|
+
"classes": "govuk-button--secondary"
|
124
|
+
},
|
125
|
+
"html": "<a href=\"/\" role=\"button\" draggable=\"false\" class=\"govuk-button govuk-button--secondary\" data-module=\"govuk-button\">\n Secondary button\n</a>"
|
126
|
+
},
|
127
|
+
{
|
128
|
+
"name": "Warning",
|
129
|
+
"options": {
|
130
|
+
"name": "Warning",
|
131
|
+
"text": "Warning button",
|
132
|
+
"classes": "govuk-button--warning"
|
133
|
+
},
|
134
|
+
"html": "<button name=\"Warning\" class=\"govuk-button govuk-button--warning\" data-module=\"govuk-button\">\n Warning button\n</button>"
|
135
|
+
},
|
136
|
+
{
|
137
|
+
"name": "Warning disabled",
|
138
|
+
"options": {
|
139
|
+
"name": "warning",
|
140
|
+
"text": "Warning button disabled",
|
141
|
+
"classes": "govuk-button--warning",
|
142
|
+
"disabled": true
|
143
|
+
},
|
144
|
+
"html": "<button name=\"warning\" disabled=\"disabled\" aria-disabled=\"true\" class=\"govuk-button govuk-button--warning govuk-button--disabled\" data-module=\"govuk-button\">\n Warning button disabled\n</button>"
|
145
|
+
},
|
146
|
+
{
|
147
|
+
"name": "Warning link",
|
148
|
+
"options": {
|
149
|
+
"name": "Warning",
|
150
|
+
"text": "Warning button",
|
151
|
+
"href": "/",
|
152
|
+
"classes": "govuk-button--warning"
|
153
|
+
},
|
154
|
+
"html": "<a href=\"/\" role=\"button\" draggable=\"false\" class=\"govuk-button govuk-button--warning\" data-module=\"govuk-button\">\n Warning button\n</a>"
|
155
|
+
},
|
156
|
+
{
|
157
|
+
"name": "attributes",
|
158
|
+
"options": {
|
159
|
+
"element": "button",
|
160
|
+
"attributes": {
|
161
|
+
"aria-controls": "example-id",
|
162
|
+
"data-tracking-dimension": 123
|
163
|
+
}
|
164
|
+
},
|
165
|
+
"html": "<button class=\"govuk-button\" data-module=\"govuk-button\" aria-controls=\"example-id\" data-tracking-dimension=\"123\">\n \n</button>"
|
166
|
+
},
|
167
|
+
{
|
168
|
+
"name": "link attributes",
|
169
|
+
"options": {
|
170
|
+
"element": "a",
|
171
|
+
"attributes": {
|
172
|
+
"aria-controls": "example-id",
|
173
|
+
"data-tracking-dimension": 123
|
174
|
+
}
|
175
|
+
},
|
176
|
+
"html": "<a href=\"#\" role=\"button\" draggable=\"false\" class=\"govuk-button\" data-module=\"govuk-button\" aria-controls=\"example-id\" data-tracking-dimension=\"123\">\n \n</a>"
|
177
|
+
},
|
178
|
+
{
|
179
|
+
"name": "input attributes",
|
180
|
+
"options": {
|
181
|
+
"element": "input",
|
182
|
+
"attributes": {
|
183
|
+
"aria-controls": "example-id",
|
184
|
+
"data-tracking-dimension": 123
|
185
|
+
}
|
186
|
+
},
|
187
|
+
"html": "<input value=\"\" type=\"submit\" class=\"govuk-button\" data-module=\"govuk-button\" aria-controls=\"example-id\" data-tracking-dimension=\"123\">"
|
188
|
+
},
|
189
|
+
{
|
190
|
+
"name": "classes",
|
191
|
+
"options": {
|
192
|
+
"element": "button",
|
193
|
+
"classes": "app-button--custom-modifier"
|
194
|
+
},
|
195
|
+
"html": "<button class=\"govuk-button app-button--custom-modifier\" data-module=\"govuk-button\">\n \n</button>"
|
196
|
+
},
|
197
|
+
{
|
198
|
+
"name": "link classes",
|
199
|
+
"options": {
|
200
|
+
"element": "a",
|
201
|
+
"classes": "app-button--custom-modifier"
|
202
|
+
},
|
203
|
+
"html": "<a href=\"#\" role=\"button\" draggable=\"false\" class=\"govuk-button app-button--custom-modifier\" data-module=\"govuk-button\">\n \n</a>"
|
204
|
+
},
|
205
|
+
{
|
206
|
+
"name": "input classes",
|
207
|
+
"options": {
|
208
|
+
"element": "input",
|
209
|
+
"classes": "app-button--custom-modifier"
|
210
|
+
},
|
211
|
+
"html": "<input value=\"\" type=\"submit\" class=\"govuk-button app-button--custom-modifier\" data-module=\"govuk-button\">"
|
212
|
+
},
|
213
|
+
{
|
214
|
+
"name": "name",
|
215
|
+
"options": {
|
216
|
+
"element": "button",
|
217
|
+
"name": "start-now"
|
218
|
+
},
|
219
|
+
"html": "<button name=\"start-now\" class=\"govuk-button\" data-module=\"govuk-button\">\n \n</button>"
|
220
|
+
},
|
221
|
+
{
|
222
|
+
"name": "type",
|
223
|
+
"options": {
|
224
|
+
"element": "button",
|
225
|
+
"type": "button"
|
226
|
+
},
|
227
|
+
"html": "<button type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">\n \n</button>"
|
228
|
+
},
|
229
|
+
{
|
230
|
+
"name": "input type",
|
231
|
+
"options": {
|
232
|
+
"element": "input",
|
233
|
+
"type": "button"
|
234
|
+
},
|
235
|
+
"html": "<input value=\"\" type=\"button\" class=\"govuk-button\" data-module=\"govuk-button\">"
|
236
|
+
},
|
237
|
+
{
|
238
|
+
"name": "explicit link",
|
239
|
+
"options": {
|
240
|
+
"element": "a",
|
241
|
+
"href": "/",
|
242
|
+
"text": "Continue"
|
243
|
+
},
|
244
|
+
"html": "<a href=\"/\" role=\"button\" draggable=\"false\" class=\"govuk-button\" data-module=\"govuk-button\">\n Continue\n</a>"
|
245
|
+
},
|
246
|
+
{
|
247
|
+
"name": "no href",
|
248
|
+
"options": {
|
249
|
+
"element": "a"
|
250
|
+
},
|
251
|
+
"html": "<a href=\"#\" role=\"button\" draggable=\"false\" class=\"govuk-button\" data-module=\"govuk-button\">\n \n</a>"
|
252
|
+
},
|
253
|
+
{
|
254
|
+
"name": "value",
|
255
|
+
"options": {
|
256
|
+
"element": "button",
|
257
|
+
"value": "start"
|
258
|
+
},
|
259
|
+
"html": "<button value=\"start\" class=\"govuk-button\" data-module=\"govuk-button\">\n \n</button>"
|
260
|
+
},
|
261
|
+
{
|
262
|
+
"name": "html",
|
263
|
+
"options": {
|
264
|
+
"element": "button",
|
265
|
+
"html": "Start <em>now</em>"
|
266
|
+
},
|
267
|
+
"html": "<button class=\"govuk-button\" data-module=\"govuk-button\">\n Start <em>now</em>\n</button>"
|
268
|
+
},
|
269
|
+
{
|
270
|
+
"name": "no data",
|
271
|
+
"options": {},
|
272
|
+
"html": "<button class=\"govuk-button\" data-module=\"govuk-button\">\n \n</button>"
|
273
|
+
}
|
274
|
+
]
|
275
|
+
}
|