From 8d5af476203274d3de36c8d42738e149af967d26 Mon Sep 17 00:00:00 2001
From: Chris Hill-Scott <me@quis.cc>
Date: Mon, 10 Apr 2017 11:16:22 +0100
Subject: [PATCH] Change class names for validation errors in html

Implements the class name changes detailed in:
https://github.com/alphagov/govuk_elements/pull/405
---
 app/assets/javascripts/main.js            |  2 --
 app/assets/stylesheets/main.scss          |  2 +-
 app/templates/components/file-upload.html |  2 +-
 app/templates/components/list-entry.html  |  2 +-
 app/templates/components/radios.html      |  6 +++---
 app/templates/components/textbox.html     | 18 ++++++++++++++----
 6 files changed, 20 insertions(+), 12 deletions(-)

diff --git a/app/assets/javascripts/main.js b/app/assets/javascripts/main.js
index 4f17b03fa..f5e930438 100644
--- a/app/assets/javascripts/main.js
+++ b/app/assets/javascripts/main.js
@@ -2,8 +2,6 @@ $(() => $("time.timeago").timeago());
 
 $(() => GOVUK.modules.start());
 
-$(() => new GOVUK.SelectionButtons('.block-label input'));
-
 $(() => $('.error-message').eq(0).parent('label').next('input').trigger('focus'));
 
 $(() => $('.banner-dangerous').eq(0).trigger('focus'));
diff --git a/app/assets/stylesheets/main.scss b/app/assets/stylesheets/main.scss
index 7cf0c200d..9fa8df2be 100644
--- a/app/assets/stylesheets/main.scss
+++ b/app/assets/stylesheets/main.scss
@@ -24,7 +24,7 @@ $path: '/static/images/';
 @import 'elements/elements-typography';
 @import 'elements/forms';
 @import 'elements/forms/form-validation';
-@import 'elements/forms/form-block-labels';
+@import 'elements/forms/form-multiple-choice';
 @import 'elements/forms/form-validation';
 @import 'elements/icons';
 @import 'elements/layout';
diff --git a/app/templates/components/file-upload.html b/app/templates/components/file-upload.html
index f6ade8216..6cbb52e74 100644
--- a/app/templates/components/file-upload.html
+++ b/app/templates/components/file-upload.html
@@ -1,5 +1,5 @@
 {% macro file_upload(field, button_text="Choose file", alternate_link=None, alternate_link_text=None) %}
-  <form method="post" enctype="multipart/form-data" class="{% if field.errors %}error{% endif %}" data-module="file-upload">
+  <form method="post" enctype="multipart/form-data" class="{% if field.errors %}form-group-error{% endif %}" data-module="file-upload">
     <label class="file-upload-label" for="{{ field.name }}">
       <span class="visually-hidden">{{ field.label.text }}</span>
       {% if hint %}
diff --git a/app/templates/components/list-entry.html b/app/templates/components/list-entry.html
index 2b72d26e1..23d54ef55 100644
--- a/app/templates/components/list-entry.html
+++ b/app/templates/components/list-entry.html
@@ -8,7 +8,7 @@
   {% if error %}
     <div class="validation-wrapper">
   {% endif %}
-    <fieldset class="form-group{% if field.errors %} error{% endif %}" id="{{ field.name }}">
+    <fieldset class="form-group{% if field.errors %} form-group-error{% endif %}" id="{{ field.name }}">
       <legend>
         <span class="form-label">
           {{ field.label.text }}
diff --git a/app/templates/components/radios.html b/app/templates/components/radios.html
index e54d4227e..f00ba49b4 100644
--- a/app/templates/components/radios.html
+++ b/app/templates/components/radios.html
@@ -4,7 +4,7 @@
   disable=[],
   option_hints={}
 ) %}
-  <div class="form-group {% if field.errors %} error{% endif %}">
+  <div class="form-group {% if field.errors %} form-group-error{% endif %}">
     <fieldset>
       <legend class="form-label">
         {{ field.label.text|safe }}
@@ -45,7 +45,7 @@
  hint=None,
  wrapping_class='form-group'
 ) %}
- <div class="{{ wrapping_class }} {% if field.errors %} error{% endif %}">
+ <div class="{{ wrapping_class }} {% if field.errors %} form-group-error{% endif %}">
    <fieldset>
      <legend class="form-label">
        {{ field.label.text }}
@@ -81,7 +81,7 @@
   hint=None,
   branding_dict={}
 ) %}
-  <div class="form-group {% if field.errors %} error{% endif %}">
+  <div class="form-group {% if field.errors %} form-group-error{% endif %}">
     <fieldset>
       <legend class="form-label">
         {{ field.label.text }}
diff --git a/app/templates/components/textbox.html b/app/templates/components/textbox.html
index 2c66c923e..937165ac3 100644
--- a/app/templates/components/textbox.html
+++ b/app/templates/components/textbox.html
@@ -11,7 +11,7 @@
   safe_error_message=False,
   rows=8
 ) %}
-  <div class="form-group{% if field.errors %} error{% endif %}" {% if autofocus %}data-module="autofocus"{% endif %}>
+  <div class="form-group{% if field.errors %} form-group-error{% endif %}" {% if autofocus %}data-module="autofocus"{% endif %}>
     <label class="form-label" for="{{ field.name }}">
       {% if label %}
         {{ label }}
@@ -29,10 +29,20 @@
         </span>
       {% endif %}
     </label>
+    {%
+      if highlight_tags
+    %}
+      {% set field_class = 'form-control-{} textbox-highlight-textbox'.format(width) %}
+    {% else %}
+      {% set field_class = 'form-control-{} {}'.format(width, 'textbox-right-aligned' if suffix else '') %}
+    {% endif %}
+    {%
+      set field_class = 'form-control ' + field_class + (
+        ' form-control-error' if field.errors else ''
+      )
+    %}
     {{ field(**{
-      'class':
-        'form-control form-control-{} textbox-highlight-textbox'.format(width) if highlight_tags else
-        'form-control form-control-{} {}'.format(width, 'textbox-right-aligned' if suffix else ''),
+      'class': field_class,
       'data-module': 'highlight-tags' if highlight_tags else '',
       'rows': rows|string
     }) }}