diff --git a/app/assets/javascripts/radioSelect.js b/app/assets/javascripts/radioSelect.js index 62fc2b938..50d4dd046 100644 --- a/app/assets/javascripts/radioSelect.js +++ b/app/assets/javascripts/radioSelect.js @@ -30,6 +30,7 @@ {{/choices}} + `), 'chosen': Hogan.compile(` @@ -56,7 +57,7 @@ let focusSelected = function() { setTimeout( () => $('[type=radio]:checked').next('label').blur().trigger('focus').addClass('selected'), - 10 + 50 ); }; @@ -67,7 +68,6 @@ let $component = $(component); let render = (state, data) => { $component.html(states[state].render(data)); - new GOVUK.SelectionButtons('.block-label input'); }; let choices = $('label', $component).toArray().map(function(element) { let $element = $(element); @@ -92,7 +92,7 @@ ), 'name': name }); - $('.js-option').eq(0).parent('label').trigger('focus'); + focusSelected(); }) .on('click', '.js-option', function(event) { diff --git a/app/assets/stylesheets/components/radio-select.scss b/app/assets/stylesheets/components/radio-select.scss index ab4575f5a..19f835310 100644 --- a/app/assets/stylesheets/components/radio-select.scss +++ b/app/assets/stylesheets/components/radio-select.scss @@ -33,6 +33,13 @@ } + .js-reset-button-block { + display: block; + width: 100%; + text-align: left; + padding: 20px 20px $gutter 57px; + } + .js-enabled & { overflow: visible;