diff --git a/Gemfile.lock b/Gemfile.lock index 0059924e9..23aebb12d 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -116,8 +116,8 @@ GEM kramdown (~> 1.5.0) nokogiri (~> 1.5) sanitize (~> 2.1.0) - govuk_elements_rails (1.2.2) - govuk_frontend_toolkit (>= 4.14.1) + govuk_elements_rails (2.2.1) + govuk_frontend_toolkit (>= 5.0.2) rails (>= 4.1.0) sass (>= 3.2.0) govuk_frontend_toolkit (5.0.2) diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js index b6e386ef0..1b04760c5 100644 --- a/app/assets/javascripts/application.js +++ b/app/assets/javascripts/application.js @@ -1,4 +1,6 @@ //= require jquery/dist/jquery.min.js +//= require govuk_toolkit +//= require checkbox-radio-init.js //= require click-tracker.js //= require mobile-nav-toggler.js //= require calculators.js diff --git a/app/assets/javascripts/checkbox-radio-init.js b/app/assets/javascripts/checkbox-radio-init.js new file mode 100644 index 000000000..372fa5d6f --- /dev/null +++ b/app/assets/javascripts/checkbox-radio-init.js @@ -0,0 +1,12 @@ +/* global GOVUK */ +$(function() { + 'use strict'; + + var $blockLabels = $('.block-label').find('input[type="radio"], input[type="checkbox"]'); + new GOVUK.SelectionButtons($blockLabels); + + var showHideContent = new GOVUK.ShowHideContent(); + showHideContent.init(); + + GOVUK.shimLinksWithButtonRole.init(); +}); diff --git a/app/views/booking_requests/step_two.html.erb b/app/views/booking_requests/step_two.html.erb index b2f52f0b8..a9089102e 100644 --- a/app/views/booking_requests/step_two.html.erb +++ b/app/views/booking_requests/step_two.html.erb @@ -142,42 +142,44 @@ <%= @booking_request.errors[:dc_pot].to_sentence %> <% end %> - <%= f.label :dc_pot, value: 'yes', class: 'block-label' do %> - <%= f.radio_button :dc_pot, 'yes', - class: 't-dc-pot-1' %> + <%= f.label :dc_pot, value: 'yes', class: 'block-label t-dc-pot-1' do %> + <%= f.radio_button :dc_pot, 'yes' %> Yes <% end %> - <%= f.label :dc_pot, value: 'no', class: 'block-label' do %> - <%= f.radio_button :dc_pot, 'no', - class: 't-dc-pot-2' %> + <%= f.label :dc_pot, value: 'no', class: 'block-label t-dc-pot-2' do %> + <%= f.radio_button :dc_pot, 'no' %> No <% end %> - <%= f.label :dc_pot, value: 'not-sure', class: 'block-label' do %> - <%= f.radio_button :dc_pot, 'not-sure', - class: 't-dc-pot-3' %> + <%= f.label :dc_pot, value: 'not-sure', class: 'block-label t-dc-pot-3' do %> + <%= f.radio_button :dc_pot, 'not-sure' %> Not sure <% end %>
- <%= f.label :accessibility_requirements do %> + <%= f.label :accessibility_requirements, class: 'block-label t-accessibility-requirements' do %> <% if @booking_request.errors.include?(:accessibility_requirements) %> <%= @booking_request.errors[:accessibility_requirements].to_sentence %> <% end %> - <%= f.check_box :accessibility_requirements, class: 't-accessibility-requirements' %> I have accessibility needs, eg wheelchair access + <%= f.check_box :accessibility_requirements %> I have accessibility needs, eg wheelchair access <% end %>
- <%= f.label :opt_in do %> - <% if @booking_request.errors.include?(:opt_in) %> - <%= @booking_request.errors[:opt_in].to_sentence %> +
+ + Terms and conditions + <% if @booking_request.errors.include?(:opt_in) %> + <%= @booking_request.errors[:opt_in].to_sentence %> + <% end %> + + <%= f.label :opt_in, class: 'block-label selection-button-checkbox t-opt-in' do %> + <%= f.check_box :opt_in %> I accept the terms and conditions <% end %> - <%= f.check_box :opt_in, class: 't-opt-in' %> I accept the terms and conditions - <% end %> +