govuk_publishing_components 62.0.0 → 62.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/app/assets/javascripts/govuk_publishing_components/components/option-select.js +4 -3
- data/app/assets/javascripts/govuk_publishing_components/lib/filter-list.js +48 -0
- data/app/assets/javascripts/govuk_publishing_components/vendor/lux/lux-reporter.js +373 -245
- data/app/assets/stylesheets/component_guide/application.scss +1 -42
- data/app/assets/stylesheets/govuk_publishing_components/components/_button.scss +5 -1
- data/app/assets/stylesheets/govuk_publishing_components/components/_contextual-sidebar.scss +6 -11
- data/app/assets/stylesheets/govuk_publishing_components/components/_option-select.scss +2 -2
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_button.scss +6 -38
- data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_warning-callout.scss +2 -3
- data/app/assets/stylesheets/govuk_publishing_components/components/helpers/_markdown-typography.scss +6 -1
- data/app/controllers/govuk_publishing_components/applications_page_controller.rb +50 -0
- data/app/models/govuk_publishing_components/applications_page.rb +64 -0
- data/app/views/govuk_publishing_components/applications_page/_table-content.html.erb +39 -0
- data/app/views/govuk_publishing_components/applications_page/show.html.erb +37 -0
- data/app/views/govuk_publishing_components/audit/show.html.erb +5 -1
- data/app/views/govuk_publishing_components/component_guide/_component_list.html.erb +14 -0
- data/app/views/govuk_publishing_components/component_guide/example.html.erb +3 -3
- data/app/views/govuk_publishing_components/component_guide/index.html.erb +50 -75
- data/app/views/govuk_publishing_components/component_guide/show.html.erb +7 -7
- data/app/views/govuk_publishing_components/components/contextual_sidebar/_ukraine_cta.html.erb +27 -25
- data/app/views/govuk_publishing_components/components/docs/govspeak.yml +6 -0
- data/app/views/govuk_publishing_components/components/docs/organisation_logo.yml +7 -1
- data/config/routes.rb +1 -0
- data/lib/govuk_publishing_components/minitest/component_guide_test.rb +1 -1
- data/lib/govuk_publishing_components/presenters/organisation_logo_helper.rb +7 -1
- data/lib/govuk_publishing_components/version.rb +1 -1
- data/node_modules/govuk-frontend/dist/govuk/all.bundle.js +37 -133
- data/node_modules/govuk-frontend/dist/govuk/all.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/all.bundle.mjs +37 -133
- data/node_modules/govuk-frontend/dist/govuk/all.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/common/govuk-frontend-version.mjs +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/accordion/_index.scss +4 -4
- data/node_modules/govuk-frontend/dist/govuk/components/accordion/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/accordion/accordion.bundle.js +1 -126
- data/node_modules/govuk-frontend/dist/govuk/components/accordion/accordion.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/accordion/accordion.bundle.mjs +1 -126
- data/node_modules/govuk-frontend/dist/govuk/components/accordion/accordion.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/breadcrumbs/_index.scss +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/breadcrumbs/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/button/_index.scss +2 -2
- data/node_modules/govuk-frontend/dist/govuk/components/button/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/character-count/character-count.bundle.js +1 -126
- data/node_modules/govuk-frontend/dist/govuk/components/character-count/character-count.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/character-count/character-count.bundle.mjs +1 -126
- data/node_modules/govuk-frontend/dist/govuk/components/character-count/character-count.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/fixtures.json +34 -29
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/macro-options.json +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template-default.html +23 -23
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template-small-with-conditional-reveal.html +21 -21
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template-small-with-divider-and-none.html +30 -30
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template-small-with-error.html +26 -26
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template-small-with-hint.html +25 -25
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template-small-with-long-text.html +23 -23
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template-small.html +23 -23
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template-with-conditional-items.html +35 -35
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template-with-divider-and-none.html +30 -30
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template-with-divider-none-and-conditional-items.html +40 -40
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template-with-error-message.html +32 -32
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template-with-hint.html +25 -25
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template-with-hints-on-items.html +21 -21
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template-with-legend-as-a-page-heading.html +27 -27
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template-with-optional-form-group-classes-showing-group-error.html +36 -36
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template-with-pre-checked-values.html +35 -35
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template-with-very-long-option-text.html +25 -25
- data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/template.njk +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/exit-this-page/_index.scss +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/exit-this-page/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/exit-this-page/exit-this-page.bundle.js +1 -126
- data/node_modules/govuk-frontend/dist/govuk/components/exit-this-page/exit-this-page.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/exit-this-page/exit-this-page.bundle.mjs +1 -126
- data/node_modules/govuk-frontend/dist/govuk/components/exit-this-page/exit-this-page.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/file-upload/_index.scss +2 -1
- data/node_modules/govuk-frontend/dist/govuk/components/file-upload/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/file-upload/file-upload.bundle.js +36 -132
- data/node_modules/govuk-frontend/dist/govuk/components/file-upload/file-upload.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/file-upload/file-upload.bundle.mjs +36 -132
- data/node_modules/govuk-frontend/dist/govuk/components/file-upload/file-upload.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/file-upload/file-upload.mjs +35 -6
- data/node_modules/govuk-frontend/dist/govuk/components/file-upload/file-upload.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/file-upload/fixtures.json +17 -0
- data/node_modules/govuk-frontend/dist/govuk/components/file-upload/template-enhanced-multiple-files.html +10 -0
- data/node_modules/govuk-frontend/dist/govuk/components/footer/_index.scss +4 -4
- data/node_modules/govuk-frontend/dist/govuk/components/footer/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/header/_index.scss +20 -20
- data/node_modules/govuk-frontend/dist/govuk/components/header/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/input/_index.scss +7 -15
- data/node_modules/govuk-frontend/dist/govuk/components/input/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/notification-banner/_index.scss +2 -2
- data/node_modules/govuk-frontend/dist/govuk/components/notification-banner/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/pagination/_index.scss +4 -2
- data/node_modules/govuk-frontend/dist/govuk/components/pagination/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/pagination/fixtures.json +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/pagination/template-with-many-pages.html +2 -2
- data/node_modules/govuk-frontend/dist/govuk/components/pagination/template.njk +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/panel/_index.scss +2 -2
- data/node_modules/govuk-frontend/dist/govuk/components/panel/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/password-input/_index.scss +2 -2
- data/node_modules/govuk-frontend/dist/govuk/components/password-input/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/password-input/password-input.bundle.js +1 -126
- data/node_modules/govuk-frontend/dist/govuk/components/password-input/password-input.bundle.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/password-input/password-input.bundle.mjs +1 -126
- data/node_modules/govuk-frontend/dist/govuk/components/password-input/password-input.bundle.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/phase-banner/_index.scss +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/phase-banner/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/radios/_index.scss +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/radios/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/radios/fixtures.json +36 -31
- data/node_modules/govuk-frontend/dist/govuk/components/radios/macro-options.json +3 -3
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-default.html +17 -17
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-inline.html +19 -19
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-small-inline.html +23 -23
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-small-with-a-divider.html +24 -24
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-small-with-conditional-reveal.html +27 -27
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-small-with-error.html +26 -26
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-small-with-hint.html +25 -25
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-small-with-long-text.html +23 -23
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-small.html +23 -23
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-with-a-divider.html +24 -24
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-with-conditional-item-checked.html +35 -35
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-with-conditional-items-and-pre-checked-value.html +35 -35
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-with-conditional-items.html +35 -35
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-with-fieldset-and-error-message.html +20 -20
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-with-hint.html +19 -19
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-with-hints-on-items.html +23 -23
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-with-legend-as-page-heading.html +21 -21
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-with-optional-form-group-classes-showing-group-error.html +36 -36
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template-with-very-long-option-text.html +28 -28
- data/node_modules/govuk-frontend/dist/govuk/components/radios/template.njk +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/select/_index.scss +1 -7
- data/node_modules/govuk-frontend/dist/govuk/components/select/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/_index.scss +5 -5
- data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/summary-list/_index.scss +16 -16
- data/node_modules/govuk-frontend/dist/govuk/components/summary-list/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/table/_index.scss +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/table/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/tabs/_index.scss +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/tabs/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/task-list/fixtures.json +46 -0
- data/node_modules/govuk-frontend/dist/govuk/components/task-list/template-forced-hover-state.html +37 -0
- data/node_modules/govuk-frontend/dist/govuk/components/textarea/_index.scss +1 -7
- data/node_modules/govuk-frontend/dist/govuk/components/textarea/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/warning-text/_index.scss +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/warning-text/_index.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/core/_govuk-frontend-properties.scss +1 -1
- data/node_modules/govuk-frontend/dist/govuk/core/_lists.scss +2 -2
- data/node_modules/govuk-frontend/dist/govuk/core/_lists.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/core/_typography.scss +3 -3
- data/node_modules/govuk-frontend/dist/govuk/core/_typography.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/govuk-frontend.min.css +2 -2
- data/node_modules/govuk-frontend/dist/govuk/govuk-frontend.min.css.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/govuk-frontend.min.js +1 -1
- data/node_modules/govuk-frontend/dist/govuk/govuk-frontend.min.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/helpers/_focused.scss +34 -0
- data/node_modules/govuk-frontend/dist/govuk/helpers/_focused.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/helpers/_grid.scss +1 -1
- data/node_modules/govuk-frontend/dist/govuk/helpers/_grid.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/helpers/_links.scss +1 -1
- data/node_modules/govuk-frontend/dist/govuk/helpers/_links.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/helpers/_media-queries.scss +172 -33
- data/node_modules/govuk-frontend/dist/govuk/helpers/_media-queries.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/helpers/_spacing.scss +1 -1
- data/node_modules/govuk-frontend/dist/govuk/helpers/_spacing.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/helpers/_typography.scss +4 -4
- data/node_modules/govuk-frontend/dist/govuk/helpers/_typography.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/i18n.mjs +1 -126
- data/node_modules/govuk-frontend/dist/govuk/i18n.mjs.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/objects/_button-group.scss +1 -1
- data/node_modules/govuk-frontend/dist/govuk/objects/_button-group.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/objects/_main-wrapper.scss +1 -1
- data/node_modules/govuk-frontend/dist/govuk/objects/_main-wrapper.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/objects/_template.scss +1 -1
- data/node_modules/govuk-frontend/dist/govuk/objects/_template.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/objects/_width-container.scss +2 -2
- data/node_modules/govuk-frontend/dist/govuk/objects/_width-container.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/overrides/_display.scss +1 -1
- data/node_modules/govuk-frontend/dist/govuk/overrides/_display.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/overrides/_width.scss +5 -5
- data/node_modules/govuk-frontend/dist/govuk/overrides/_width.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/settings/_media-queries.scss +7 -0
- data/node_modules/govuk-frontend/dist/govuk/settings/_media-queries.scss.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/tools/_px-to-em.scss +4 -2
- data/node_modules/govuk-frontend/dist/govuk/tools/_px-to-em.scss.map +1 -1
- data/node_modules/govuk-frontend/govuk-prototype-kit.config.json +1 -1
- data/node_modules/govuk-frontend/package.json +9 -8
- metadata +9 -4
- data/app/assets/javascripts/component_guide/filter-components.js +0 -35
- data/node_modules/govuk-frontend/dist/govuk/vendor/_sass-mq.scss +0 -349
- data/node_modules/govuk-frontend/dist/govuk/vendor/_sass-mq.scss.map +0 -1
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
"description": "",
|
|
26
26
|
"pageTemplateOptions": {},
|
|
27
27
|
"screenshot": true,
|
|
28
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n
|
|
28
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-default\" name=\"example-default\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-default\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-default-2\" name=\"example-default\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-default-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
29
29
|
},
|
|
30
30
|
{
|
|
31
31
|
"name": "with hint",
|
|
@@ -54,7 +54,7 @@
|
|
|
54
54
|
"description": "",
|
|
55
55
|
"pageTemplateOptions": {},
|
|
56
56
|
"screenshot": false,
|
|
57
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"example-with-hint-hint\">\n
|
|
57
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"example-with-hint-hint\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <div id=\"example-with-hint-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-with-hint\" name=\"example-with-hint\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-with-hint\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-with-hint-2\" name=\"example-with-hint\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-with-hint-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
58
58
|
},
|
|
59
59
|
{
|
|
60
60
|
"name": "inline",
|
|
@@ -86,7 +86,7 @@
|
|
|
86
86
|
"description": "",
|
|
87
87
|
"pageTemplateOptions": {},
|
|
88
88
|
"screenshot": true,
|
|
89
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"example-hint\">\n
|
|
89
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"example-hint\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <div id=\"example-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n <div class=\"govuk-radios govuk-radios--inline\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example\" name=\"example\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-2\" name=\"example\" type=\"radio\" value=\"no\" checked>\n <label class=\"govuk-label govuk-radios__label\" for=\"example-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
90
90
|
},
|
|
91
91
|
{
|
|
92
92
|
"name": "with legend as page heading",
|
|
@@ -118,7 +118,7 @@
|
|
|
118
118
|
"description": "",
|
|
119
119
|
"pageTemplateOptions": {},
|
|
120
120
|
"screenshot": false,
|
|
121
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"housing-act-hint\">\n
|
|
121
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"housing-act-hint\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n <h1 class=\"govuk-fieldset__heading\">\n Which part of the Housing Act was your licence issued under?\n </h1>\n </legend>\n <div id=\"housing-act-hint\" class=\"govuk-hint\">\n Select one of the options below.\n </div>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"housing-act\" name=\"housing-act\" type=\"radio\" value=\"part-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"housing-act\">\n <span class=\"govuk-heading-s govuk-!-margin-bottom-1\">Part 2 of the Housing Act 2004</span> For properties that are 3 or more stories high and occupied by 5 or more people\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"housing-act-2\" name=\"housing-act\" type=\"radio\" value=\"part-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"housing-act-2\">\n <span class=\"govuk-heading-s govuk-!-margin-bottom-1\">Part 3 of the Housing Act 2004</span> For properties that are within a geographical area defined by a local council\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
122
122
|
},
|
|
123
123
|
{
|
|
124
124
|
"name": "with a divider",
|
|
@@ -152,7 +152,7 @@
|
|
|
152
152
|
"description": "",
|
|
153
153
|
"pageTemplateOptions": {},
|
|
154
154
|
"screenshot": true,
|
|
155
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n
|
|
155
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to sign in?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-divider\" name=\"example\" type=\"radio\" value=\"government-gateway\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-divider\">\n Use Government Gateway\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-divider-2\" name=\"example\" type=\"radio\" value=\"govuk-verify\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-divider-2\">\n Use GOV.UK Verify\n </label>\n </div>\n <div class=\"govuk-radios__divider\">or</div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-divider-4\" name=\"example\" type=\"radio\" value=\"create-account\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-divider-4\">\n Create an account\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
156
156
|
},
|
|
157
157
|
{
|
|
158
158
|
"name": "with hints on items",
|
|
@@ -189,7 +189,7 @@
|
|
|
189
189
|
"description": "",
|
|
190
190
|
"pageTemplateOptions": {},
|
|
191
191
|
"screenshot": false,
|
|
192
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n
|
|
192
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n <h1 class=\"govuk-fieldset__heading\">\n How do you want to sign in?\n </h1>\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"gateway\" name=\"gov\" type=\"radio\" value=\"gateway\" aria-describedby=\"gateway-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"gateway\">\n Sign in with Government Gateway\n </label>\n <div id=\"gateway-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n You’ll have a user ID if you’ve registered for Self Assessment or filed a tax return online before.\n </div>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"verify\" name=\"gov\" type=\"radio\" value=\"verify\" aria-describedby=\"verify-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"verify\">\n Sign in with GOV.UK Verify\n </label>\n <div id=\"verify-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n You’ll have an account if you’ve already proved your identity with either Barclays, CitizenSafe, Digidentity, Experian, Post Office, Royal Mail or SecureIdentity.\n </div>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
193
193
|
},
|
|
194
194
|
{
|
|
195
195
|
"name": "without fieldset",
|
|
@@ -245,7 +245,7 @@
|
|
|
245
245
|
"description": "",
|
|
246
246
|
"pageTemplateOptions": {},
|
|
247
247
|
"screenshot": false,
|
|
248
|
-
"html": "<div class=\"govuk-form-group govuk-form-group--error\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"example-error\">\n
|
|
248
|
+
"html": "<div class=\"govuk-form-group govuk-form-group--error\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"example-error\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <p id=\"example-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </p>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example\" name=\"example\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-2\" name=\"example\" type=\"radio\" value=\"no\" checked>\n <label class=\"govuk-label govuk-radios__label\" for=\"example-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
249
249
|
},
|
|
250
250
|
{
|
|
251
251
|
"name": "with very long option text",
|
|
@@ -281,7 +281,7 @@
|
|
|
281
281
|
"description": "",
|
|
282
282
|
"pageTemplateOptions": {},
|
|
283
283
|
"screenshot": false,
|
|
284
|
-
"html": "<div class=\"govuk-form-group govuk-form-group--error\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"waste-hint waste-error\">\n
|
|
284
|
+
"html": "<div class=\"govuk-form-group govuk-form-group--error\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"waste-hint waste-error\">\n <legend class=\"govuk-fieldset__legend\">\n Maecenas faucibus mollis interdum?\n </legend>\n <div id=\"waste-hint\" class=\"govuk-hint\">\n Nullam id dolor id nibh ultricies vehicula ut id elit.\n </div>\n <p id=\"waste-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Lorem ipsum dolor sit amet, consectetur adipiscing elit.\n </p>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"waste\" name=\"waste\" type=\"radio\" value=\"nullam\">\n <label class=\"govuk-label govuk-radios__label\" for=\"waste\">\n Nullam id dolor id nibh ultricies vehicula ut id elit. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Donec id elit non mi porta gravida at eget metus.\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"waste-2\" name=\"waste\" type=\"radio\" value=\"aenean\">\n <label class=\"govuk-label govuk-radios__label\" for=\"waste-2\">\n Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Donec sed odio dui. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras mattis consectetur purus sit amet fermentum.\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"waste-3\" name=\"waste\" type=\"radio\" value=\"fusce\">\n <label class=\"govuk-label govuk-radios__label\" for=\"waste-3\">\n Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Etiam porta sem malesuada magna mollis euismod. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. Sed posuere consectetur est at lobortis.\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
285
285
|
},
|
|
286
286
|
{
|
|
287
287
|
"name": "with conditional items",
|
|
@@ -321,7 +321,7 @@
|
|
|
321
321
|
"description": "",
|
|
322
322
|
"pageTemplateOptions": {},
|
|
323
323
|
"screenshot": false,
|
|
324
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n
|
|
324
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted\" name=\"how-contacted\" type=\"radio\" value=\"email\" data-aria-controls=\"conditional-how-contacted\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted\">\n <label class=\"govuk-label\" for=\"context-email\">Email address</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"context-email\" type=\"text\" id=\"context-email\">\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted\" type=\"radio\" value=\"phone\" data-aria-controls=\"conditional-how-contacted-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted-2\">\n <label class=\"govuk-label\" for=\"contact-phone\">Phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-phone\" type=\"text\" id=\"contact-phone\">\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-3\" name=\"how-contacted\" type=\"radio\" value=\"text\" data-aria-controls=\"conditional-how-contacted-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-3\">\n Text message\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted-3\">\n <label class=\"govuk-label\" for=\"contact-text-message\">Mobile phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-text-message\" type=\"text\" id=\"contact-text-message\">\n </div>\n </div>\n</fieldset>\n</div>"
|
|
325
325
|
},
|
|
326
326
|
{
|
|
327
327
|
"name": "with conditional item checked",
|
|
@@ -367,7 +367,7 @@
|
|
|
367
367
|
"no-js"
|
|
368
368
|
]
|
|
369
369
|
},
|
|
370
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n
|
|
370
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked\" name=\"how-contacted-checked\" type=\"radio\" value=\"email\" checked data-aria-controls=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__conditional\" id=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label\" for=\"context-email\">Email</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"context-email\" type=\"text\" id=\"context-email\">\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked-2\" name=\"how-contacted-checked\" type=\"radio\" value=\"phone\" data-aria-controls=\"conditional-how-contacted-checked-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted-checked-2\">\n <label class=\"govuk-label\" for=\"contact-phone\">Phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-phone\" type=\"text\" id=\"contact-phone\">\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked-3\" name=\"how-contacted-checked\" type=\"radio\" value=\"text\" data-aria-controls=\"conditional-how-contacted-checked-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked-3\">\n Text message\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted-checked-3\">\n <label class=\"govuk-label\" for=\"contact-text-message\">Mobile phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-text-message\" type=\"text\" id=\"contact-text-message\">\n </div>\n </div>\n</fieldset>\n</div>"
|
|
371
371
|
},
|
|
372
372
|
{
|
|
373
373
|
"name": "with optional form-group classes showing group error",
|
|
@@ -411,7 +411,7 @@
|
|
|
411
411
|
"description": "",
|
|
412
412
|
"pageTemplateOptions": {},
|
|
413
413
|
"screenshot": false,
|
|
414
|
-
"html": "<div class=\"govuk-form-group govuk-form-group--error\">\n <fieldset class=\"govuk-fieldset\">\n
|
|
414
|
+
"html": "<div class=\"govuk-form-group govuk-form-group--error\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted-2\" type=\"radio\" value=\"email\" data-aria-controls=\"conditional-how-contacted-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted-2\">\n <label class=\"govuk-label\" for=\"context-email\">Email address</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"context-email\" type=\"text\" id=\"context-email\">\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-2\" name=\"how-contacted-2\" type=\"radio\" value=\"phone\" checked data-aria-controls=\"conditional-how-contacted-2-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__conditional\" id=\"conditional-how-contacted-2-2\">\n <label class=\"govuk-label\" for=\"contact-phone\">Phone number</label>\n<span id=\"contact-phone-error\" class=\"govuk-error-message\">Problem with input</span>\n<input class=\"govuk-input govuk-input--error govuk-!-width-one-third\" name=\"contact-phone\" type=\"text\" id=\"contact-phone\" aria-describedby=\"contact-phone-error\">\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-3\" name=\"how-contacted-2\" type=\"radio\" value=\"text\" data-aria-controls=\"conditional-how-contacted-2-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-3\">\n Text message\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted-2-3\">\n <label class=\"govuk-label\" for=\"contact-text-message\">Mobile phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-text-message\" type=\"text\" id=\"contact-text-message\">\n </div>\n </div>\n</fieldset>\n</div>"
|
|
415
415
|
},
|
|
416
416
|
{
|
|
417
417
|
"name": "small",
|
|
@@ -445,7 +445,7 @@
|
|
|
445
445
|
"description": "",
|
|
446
446
|
"pageTemplateOptions": {},
|
|
447
447
|
"screenshot": true,
|
|
448
|
-
"html": "<div class=\"govuk-form-group govuk-radios--small\">\n <fieldset class=\"govuk-fieldset\">\n
|
|
448
|
+
"html": "<div class=\"govuk-form-group govuk-radios--small\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted-2\" type=\"radio\" value=\"email\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-2\" name=\"how-contacted-2\" type=\"radio\" value=\"phone\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-3\" name=\"how-contacted-2\" type=\"radio\" value=\"text\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-3\">\n Text message\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
449
449
|
},
|
|
450
450
|
{
|
|
451
451
|
"name": "small with long text",
|
|
@@ -477,7 +477,7 @@
|
|
|
477
477
|
"description": "",
|
|
478
478
|
"pageTemplateOptions": {},
|
|
479
479
|
"screenshot": false,
|
|
480
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n
|
|
480
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n Venenatis Condimentum\n </legend>\n <div class=\"govuk-radios govuk-radios--small\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"foo\" name=\"foo\" type=\"radio\" value=\"nullam\">\n <label class=\"govuk-label govuk-radios__label\" for=\"foo\">\n Nullam id dolor id nibh ultricies vehicula ut id elit. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Donec id elit non mi porta gravida at eget metus.\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"foo-2\" name=\"foo\" type=\"radio\" value=\"aenean\">\n <label class=\"govuk-label govuk-radios__label\" for=\"foo-2\">\n Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Donec sed odio dui. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Cras mattis consectetur purus sit amet fermentum.\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"foo-3\" name=\"foo\" type=\"radio\" value=\"fusce\">\n <label class=\"govuk-label govuk-radios__label\" for=\"foo-3\">\n Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Etiam porta sem malesuada magna mollis euismod. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. Sed posuere consectetur est at lobortis.\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
481
481
|
},
|
|
482
482
|
{
|
|
483
483
|
"name": "small with error",
|
|
@@ -514,7 +514,7 @@
|
|
|
514
514
|
"description": "",
|
|
515
515
|
"pageTemplateOptions": {},
|
|
516
516
|
"screenshot": false,
|
|
517
|
-
"html": "<div class=\"govuk-form-group govuk-form-group--error govuk-radios--small\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"how-contacted-2-error\">\n
|
|
517
|
+
"html": "<div class=\"govuk-form-group govuk-form-group--error govuk-radios--small\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"how-contacted-2-error\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <p id=\"how-contacted-2-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Select a thing\n </p>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted-2\" type=\"radio\" value=\"email\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-2\" name=\"how-contacted-2\" type=\"radio\" value=\"phone\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-3\" name=\"how-contacted-2\" type=\"radio\" value=\"text\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-3\">\n Text message\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
518
518
|
},
|
|
519
519
|
{
|
|
520
520
|
"name": "small with hint",
|
|
@@ -551,7 +551,7 @@
|
|
|
551
551
|
"description": "",
|
|
552
552
|
"pageTemplateOptions": {},
|
|
553
553
|
"screenshot": false,
|
|
554
|
-
"html": "<div class=\"govuk-form-group govuk-radios--small\">\n <fieldset class=\"govuk-fieldset\">\n
|
|
554
|
+
"html": "<div class=\"govuk-form-group govuk-radios--small\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted-2\" type=\"radio\" value=\"email\" aria-describedby=\"how-contacted-2-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Email\n </label>\n <div id=\"how-contacted-2-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n Hint for email address\n </div>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-2\" name=\"how-contacted-2\" type=\"radio\" value=\"phone\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-3\" name=\"how-contacted-2\" type=\"radio\" value=\"text\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-3\">\n Text message\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
555
555
|
},
|
|
556
556
|
{
|
|
557
557
|
"name": "small with conditional reveal",
|
|
@@ -588,7 +588,7 @@
|
|
|
588
588
|
"description": "",
|
|
589
589
|
"pageTemplateOptions": {},
|
|
590
590
|
"screenshot": false,
|
|
591
|
-
"html": "<div class=\"govuk-form-group govuk-radios--small\">\n <fieldset class=\"govuk-fieldset\">\n
|
|
591
|
+
"html": "<div class=\"govuk-form-group govuk-radios--small\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2\" name=\"how-contacted-2\" type=\"radio\" value=\"email\" data-aria-controls=\"conditional-how-contacted-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted-2\">\n <label class=\"govuk-label\" for=\"context-email\">Foo</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"context-email\" type=\"text\" id=\"context-email\">\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-2\" name=\"how-contacted-2\" type=\"radio\" value=\"phone\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-2-3\" name=\"how-contacted-2\" type=\"radio\" value=\"text\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-2-3\">\n Text message\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
592
592
|
},
|
|
593
593
|
{
|
|
594
594
|
"name": "small inline",
|
|
@@ -620,7 +620,7 @@
|
|
|
620
620
|
"description": "",
|
|
621
621
|
"pageTemplateOptions": {},
|
|
622
622
|
"screenshot": false,
|
|
623
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n
|
|
623
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n Sort by\n </legend>\n <div class=\"govuk-radios govuk-radios--small govuk-radios--inline\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort\" name=\"example\" type=\"radio\" value=\"relevance\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort\">\n relevance\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-2\" name=\"example\" type=\"radio\" value=\"title\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-2\">\n title\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"sort-3\" name=\"example\" type=\"radio\" value=\"created\">\n <label class=\"govuk-label govuk-radios__label\" for=\"sort-3\">\n created\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
624
624
|
},
|
|
625
625
|
{
|
|
626
626
|
"name": "small with a divider",
|
|
@@ -655,7 +655,7 @@
|
|
|
655
655
|
"description": "",
|
|
656
656
|
"pageTemplateOptions": {},
|
|
657
657
|
"screenshot": false,
|
|
658
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n
|
|
658
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to sign in?\n </legend>\n <div class=\"govuk-radios govuk-radios--small\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-small-divider\" name=\"example\" type=\"radio\" value=\"government-gateway\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-small-divider\">\n Use Government Gateway\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-small-divider-2\" name=\"example\" type=\"radio\" value=\"govuk-verify\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-small-divider-2\">\n Use GOV.UK Verify\n </label>\n </div>\n <div class=\"govuk-radios__divider\">or</div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-small-divider-4\" name=\"example\" type=\"radio\" value=\"create-account\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-small-divider-4\">\n Create an account\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
659
659
|
},
|
|
660
660
|
{
|
|
661
661
|
"name": "with idPrefix",
|
|
@@ -748,7 +748,7 @@
|
|
|
748
748
|
"description": "",
|
|
749
749
|
"pageTemplateOptions": {},
|
|
750
750
|
"screenshot": false,
|
|
751
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"test-target-element\">\n
|
|
751
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"test-target-element\">\n <legend class=\"govuk-fieldset__legend\">\n Which option?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name\" name=\"example-name\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-name-2\" name=\"example-name\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-name-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
752
752
|
},
|
|
753
753
|
{
|
|
754
754
|
"name": "attributes",
|
|
@@ -881,7 +881,7 @@
|
|
|
881
881
|
"description": "",
|
|
882
882
|
"pageTemplateOptions": {},
|
|
883
883
|
"screenshot": false,
|
|
884
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"example-multiple-hints-hint\">\n
|
|
884
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"example-multiple-hints-hint\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <div id=\"example-multiple-hints-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-multiple-hints\" name=\"example-multiple-hints\" type=\"radio\" value=\"yes\" aria-describedby=\"example-multiple-hints-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-multiple-hints\">\n Yes\n </label>\n <div id=\"example-multiple-hints-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n Hint for yes option here\n </div>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-multiple-hints-2\" name=\"example-multiple-hints\" type=\"radio\" value=\"no\" aria-describedby=\"example-multiple-hints-2-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-multiple-hints-2\">\n No\n </label>\n <div id=\"example-multiple-hints-2-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n Hint for no option here\n </div>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
885
885
|
},
|
|
886
886
|
{
|
|
887
887
|
"name": "with describedBy and hint",
|
|
@@ -911,7 +911,7 @@
|
|
|
911
911
|
"description": "",
|
|
912
912
|
"pageTemplateOptions": {},
|
|
913
913
|
"screenshot": false,
|
|
914
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"test-target-element example-hint-describedby-hint\">\n
|
|
914
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"test-target-element example-hint-describedby-hint\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <div id=\"example-hint-describedby-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-hint-describedby\" name=\"example-hint-describedby\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-hint-describedby\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-hint-describedby-2\" name=\"example-hint-describedby\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-hint-describedby-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
915
915
|
},
|
|
916
916
|
{
|
|
917
917
|
"name": "with error message",
|
|
@@ -992,7 +992,7 @@
|
|
|
992
992
|
"description": "",
|
|
993
993
|
"pageTemplateOptions": {},
|
|
994
994
|
"screenshot": false,
|
|
995
|
-
"html": "<div class=\"govuk-form-group govuk-form-group--error\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"example-error-message-hint-hint example-error-message-hint-error\">\n
|
|
995
|
+
"html": "<div class=\"govuk-form-group govuk-form-group--error\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"example-error-message-hint-hint example-error-message-hint-error\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <div id=\"example-error-message-hint-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n <p id=\"example-error-message-hint-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </p>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-error-message-hint\" name=\"example-error-message-hint\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-error-message-hint\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-error-message-hint-2\" name=\"example-error-message-hint\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-error-message-hint-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
996
996
|
},
|
|
997
997
|
{
|
|
998
998
|
"name": "with hint, error message and describedBy",
|
|
@@ -1025,7 +1025,7 @@
|
|
|
1025
1025
|
"description": "",
|
|
1026
1026
|
"pageTemplateOptions": {},
|
|
1027
1027
|
"screenshot": false,
|
|
1028
|
-
"html": "<div class=\"govuk-form-group govuk-form-group--error\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"test-target-element example-error-message-hint-hint example-error-message-hint-error\">\n
|
|
1028
|
+
"html": "<div class=\"govuk-form-group govuk-form-group--error\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"test-target-element example-error-message-hint-hint example-error-message-hint-error\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <div id=\"example-error-message-hint-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n <p id=\"example-error-message-hint-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </p>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-error-message-hint\" name=\"example-error-message-hint\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-error-message-hint\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-error-message-hint-2\" name=\"example-error-message-hint\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-error-message-hint-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
1029
1029
|
},
|
|
1030
1030
|
{
|
|
1031
1031
|
"name": "label with attributes",
|
|
@@ -1082,7 +1082,7 @@
|
|
|
1082
1082
|
"description": "",
|
|
1083
1083
|
"pageTemplateOptions": {},
|
|
1084
1084
|
"screenshot": false,
|
|
1085
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset app-fieldset--custom-modifier\" aria-describedby=\"example-fieldset-params-hint\" data-attribute=\"value\" data-second-attribute=\"second-value\">\n
|
|
1085
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset app-fieldset--custom-modifier\" aria-describedby=\"example-fieldset-params-hint\" data-attribute=\"value\" data-second-attribute=\"second-value\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <div id=\"example-fieldset-params-hint\" class=\"govuk-hint\">\n This includes changing your last name or spelling your name differently.\n </div>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-fieldset-params\" name=\"example-fieldset-params\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-fieldset-params\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-fieldset-params-2\" name=\"example-fieldset-params\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example-fieldset-params-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
1086
1086
|
},
|
|
1087
1087
|
{
|
|
1088
1088
|
"name": "fieldset with html",
|
|
@@ -1108,7 +1108,7 @@
|
|
|
1108
1108
|
"description": "",
|
|
1109
1109
|
"pageTemplateOptions": {},
|
|
1110
1110
|
"screenshot": false,
|
|
1111
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n
|
|
1111
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n Have <b>you</b> changed your name?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"with-fieldset-html\" name=\"with-fieldset-html\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"with-fieldset-html\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"with-fieldset-html-2\" name=\"with-fieldset-html\" type=\"radio\" value=\"no\">\n <label class=\"govuk-label govuk-radios__label\" for=\"with-fieldset-html-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
1112
1112
|
},
|
|
1113
1113
|
{
|
|
1114
1114
|
"name": "with fieldset, error message and describedBy",
|
|
@@ -1140,7 +1140,7 @@
|
|
|
1140
1140
|
"description": "",
|
|
1141
1141
|
"pageTemplateOptions": {},
|
|
1142
1142
|
"screenshot": false,
|
|
1143
|
-
"html": "<div class=\"govuk-form-group govuk-form-group--error\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"test-target-element example-error\">\n
|
|
1143
|
+
"html": "<div class=\"govuk-form-group govuk-form-group--error\">\n <fieldset class=\"govuk-fieldset\" aria-describedby=\"test-target-element example-error\">\n <legend class=\"govuk-fieldset__legend\">\n Have you changed your name?\n </legend>\n <p id=\"example-error\" class=\"govuk-error-message\">\n <span class=\"govuk-visually-hidden\">Error:</span> Please select an option\n </p>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example\" name=\"example\" type=\"radio\" value=\"yes\">\n <label class=\"govuk-label govuk-radios__label\" for=\"example\">\n Yes\n </label>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"example-2\" name=\"example\" type=\"radio\" value=\"no\" checked>\n <label class=\"govuk-label govuk-radios__label\" for=\"example-2\">\n No\n </label>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
1144
1144
|
},
|
|
1145
1145
|
{
|
|
1146
1146
|
"name": "item checked overrides value",
|
|
@@ -1173,12 +1173,17 @@
|
|
|
1173
1173
|
"name": "textarea in conditional",
|
|
1174
1174
|
"options": {
|
|
1175
1175
|
"name": "conditional",
|
|
1176
|
+
"fieldset": {
|
|
1177
|
+
"legend": {
|
|
1178
|
+
"text": "Test"
|
|
1179
|
+
}
|
|
1180
|
+
},
|
|
1176
1181
|
"items": [
|
|
1177
1182
|
{
|
|
1178
1183
|
"value": "other",
|
|
1179
1184
|
"text": "Other",
|
|
1180
1185
|
"conditional": {
|
|
1181
|
-
"html": "<label class=\"govuk-label\" for=\"conditional-textarea\">textarea</label>\n<textarea class=\"govuk-textarea
|
|
1186
|
+
"html": "<label class=\"govuk-label\" for=\"conditional-textarea\">textarea</label>\n<textarea class=\"govuk-textarea\" name=\"conditional-textarea\" id=\"conditional-textarea\">\ntest\n</textarea>\n"
|
|
1182
1187
|
}
|
|
1183
1188
|
}
|
|
1184
1189
|
]
|
|
@@ -1187,7 +1192,7 @@
|
|
|
1187
1192
|
"description": "",
|
|
1188
1193
|
"pageTemplateOptions": {},
|
|
1189
1194
|
"screenshot": false,
|
|
1190
|
-
"html": "<div class=\"govuk-form-group\">\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"conditional\" name=\"conditional\" type=\"radio\" value=\"other\" data-aria-controls=\"conditional-conditional\">\n <label class=\"govuk-label govuk-radios__label\" for=\"conditional\">\n Other\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-conditional\">\n <label class=\"govuk-label\" for=\"conditional-textarea\">textarea</label>\n<textarea class=\"govuk-textarea
|
|
1195
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n Test\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"conditional\" name=\"conditional\" type=\"radio\" value=\"other\" data-aria-controls=\"conditional-conditional\">\n <label class=\"govuk-label govuk-radios__label\" for=\"conditional\">\n Other\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-conditional\">\n <label class=\"govuk-label\" for=\"conditional-textarea\">textarea</label>\n<textarea class=\"govuk-textarea\" name=\"conditional-textarea\" id=\"conditional-textarea\">\ntest\n</textarea>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
1191
1196
|
},
|
|
1192
1197
|
{
|
|
1193
1198
|
"name": "with disabled",
|
|
@@ -1225,7 +1230,7 @@
|
|
|
1225
1230
|
"description": "",
|
|
1226
1231
|
"pageTemplateOptions": {},
|
|
1227
1232
|
"screenshot": false,
|
|
1228
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n
|
|
1233
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend govuk-fieldset__legend--l\">\n <h1 class=\"govuk-fieldset__heading\">\n How do you want to sign in?\n </h1>\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"gateway\" name=\"gov\" type=\"radio\" value=\"gateway\" aria-describedby=\"gateway-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"gateway\">\n Sign in with Government Gateway\n </label>\n <div id=\"gateway-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n You’ll have a user ID if you’ve registered for Self Assessment or filed a tax return online before.\n </div>\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"verify\" name=\"gov\" type=\"radio\" value=\"verify\" disabled aria-describedby=\"verify-item-hint\">\n <label class=\"govuk-label govuk-radios__label\" for=\"verify\">\n Sign in with GOV.UK Verify\n </label>\n <div id=\"verify-item-hint\" class=\"govuk-hint govuk-radios__hint\">\n You’ll have an account if you’ve already proved your identity with either Barclays, CitizenSafe, Digidentity, Experian, Post Office, Royal Mail or SecureIdentity.\n </div>\n </div>\n </div>\n</fieldset>\n</div>"
|
|
1229
1234
|
},
|
|
1230
1235
|
{
|
|
1231
1236
|
"name": "prechecked using value",
|
|
@@ -1287,7 +1292,7 @@
|
|
|
1287
1292
|
"description": "",
|
|
1288
1293
|
"pageTemplateOptions": {},
|
|
1289
1294
|
"screenshot": false,
|
|
1290
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n
|
|
1295
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"user.profile[contact-prefs]\" name=\"contact-prefs\" type=\"radio\" value=\"email\" data-aria-controls=\"conditional-user.profile[contact-prefs]\">\n <label class=\"govuk-label govuk-radios__label\" for=\"user.profile[contact-prefs]\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-user.profile[contact-prefs]\">\n <label class=\"govuk-label\" for=\"context-email\">Email address</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"context-email\" type=\"text\" id=\"context-email\">\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"user.profile[contact-prefs]-2\" name=\"contact-prefs\" type=\"radio\" value=\"phone\" data-aria-controls=\"conditional-user.profile[contact-prefs]-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"user.profile[contact-prefs]-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-user.profile[contact-prefs]-2\">\n <label class=\"govuk-label\" for=\"contact-phone\">Phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-phone\" type=\"text\" id=\"contact-phone\">\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"user.profile[contact-prefs]-3\" name=\"contact-prefs\" type=\"radio\" value=\"text\" data-aria-controls=\"conditional-user.profile[contact-prefs]-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"user.profile[contact-prefs]-3\">\n Text message\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-user.profile[contact-prefs]-3\">\n <label class=\"govuk-label\" for=\"contact-text-message\">Mobile phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-text-message\" type=\"text\" id=\"contact-text-message\">\n </div>\n </div>\n</fieldset>\n</div>"
|
|
1291
1296
|
},
|
|
1292
1297
|
{
|
|
1293
1298
|
"name": "with conditional items and pre-checked value",
|
|
@@ -1328,7 +1333,7 @@
|
|
|
1328
1333
|
"description": "",
|
|
1329
1334
|
"pageTemplateOptions": {},
|
|
1330
1335
|
"screenshot": false,
|
|
1331
|
-
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n
|
|
1336
|
+
"html": "<div class=\"govuk-form-group\">\n <fieldset class=\"govuk-fieldset\">\n <legend class=\"govuk-fieldset__legend\">\n How do you want to be contacted?\n </legend>\n <div class=\"govuk-radios\" data-module=\"govuk-radios\">\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked\" name=\"how-contacted-checked\" type=\"radio\" value=\"email\" data-aria-controls=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked\">\n Email\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted-checked\">\n <label class=\"govuk-label\" for=\"context-email\">Email</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"context-email\" type=\"text\" id=\"context-email\">\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked-2\" name=\"how-contacted-checked\" type=\"radio\" value=\"phone\" data-aria-controls=\"conditional-how-contacted-checked-2\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked-2\">\n Phone\n </label>\n </div>\n <div class=\"govuk-radios__conditional govuk-radios__conditional--hidden\" id=\"conditional-how-contacted-checked-2\">\n <label class=\"govuk-label\" for=\"contact-phone\">Phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-phone\" type=\"text\" id=\"contact-phone\">\n </div>\n <div class=\"govuk-radios__item\">\n <input class=\"govuk-radios__input\" id=\"how-contacted-checked-3\" name=\"how-contacted-checked\" type=\"radio\" value=\"text\" checked data-aria-controls=\"conditional-how-contacted-checked-3\">\n <label class=\"govuk-label govuk-radios__label\" for=\"how-contacted-checked-3\">\n Text message\n </label>\n </div>\n <div class=\"govuk-radios__conditional\" id=\"conditional-how-contacted-checked-3\">\n <label class=\"govuk-label\" for=\"contact-text-message\">Mobile phone number</label>\n<input class=\"govuk-input govuk-!-width-one-third\" name=\"contact-text-message\" type=\"text\" id=\"contact-text-message\">\n </div>\n </div>\n</fieldset>\n</div>"
|
|
1332
1337
|
}
|
|
1333
1338
|
]
|
|
1334
1339
|
}
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
"name": "beforeInputs",
|
|
43
43
|
"type": "object",
|
|
44
44
|
"required": false,
|
|
45
|
-
"description": "Content to add before all radio items within the
|
|
45
|
+
"description": "Content to add before all radio items within the radios component.",
|
|
46
46
|
"params": [
|
|
47
47
|
{
|
|
48
48
|
"name": "text",
|
|
@@ -62,7 +62,7 @@
|
|
|
62
62
|
"name": "afterInputs",
|
|
63
63
|
"type": "object",
|
|
64
64
|
"required": false,
|
|
65
|
-
"description": "Content to add after all radio items within the
|
|
65
|
+
"description": "Content to add after all radio items within the radios component.",
|
|
66
66
|
"params": [
|
|
67
67
|
{
|
|
68
68
|
"name": "text",
|
|
@@ -206,6 +206,6 @@
|
|
|
206
206
|
"name": "attributes",
|
|
207
207
|
"type": "object",
|
|
208
208
|
"required": false,
|
|
209
|
-
"description": "HTML attributes (for example data attributes) to add to the radio
|
|
209
|
+
"description": "HTML attributes (for example data attributes) to add to the radio container."
|
|
210
210
|
}
|
|
211
211
|
]
|