hof 20.0.0-beta.16 → 20.0.0-beta.19

package/frontend/template-mixins/partials/forms/input-text-date.html

@@ -14,7 +14,7 @@
               type="{{type}}"
               name="{{id}}"
               id="{{id}}"
-              class="govuk-input{{#className}} {{className}}{{/className}}{{#error}} invalid-input{{/error}}"
+              class="govuk-input{{#className}} {{className}}{{/className}}{{#error}} govuk-input—error{{/error}}"
               aria-required="{{required}}"
               {{#value}} value="{{value}}"{{/value}}
               {{#min}} min="{{min}}"{{/min}}

package/frontend/template-mixins/partials/forms/input-text-group.html

@@ -1,5 +1,5 @@
 <div id="{{id}}-group" class="{{#compound}} form-group-compound{{/compound}}{{#formGroupClassName}}{{formGroupClassName}}{{/formGroupClassName}}{{#error}} govuk-form-group--error{{/error}}">
-    {{#isPageHeading}}<h1 class="govuk-label-wrapper">{{/isPageHeading}}<label for="{{id}}" class="{{labelClassName}}">
+    {{#isPageHeading}}<h1 class="govuk-label-wrapper">{{/isPageHeading}}<label for="{{id}}" class="{{labelClassName}}{{#isPageHeading}}govuk-label--l{{/isPageHeading}}">
         {{{label}}}
       </label>
     {{#isPageHeading}}</h1>{{/isPageHeading}}
@@ -19,7 +19,7 @@
             type="{{type}}"
             name="{{id}}"
             id="{{id}}"
-            class="{{^className}}govuk-input{{/className}}{{#className}}{{className}}{{/className}}{{#error}} invalid-input{{/error}}"
+            class="{{^className}}govuk-input{{/className}}{{#className}}{{className}}{{/className}}{{#error}} govuk-input—error{{/error}}"
             aria-required="{{required}}"
             {{#value}} value="{{value}}"{{/value}}
             {{#min}} min="{{min}}"{{/min}}

package/frontend/template-mixins/partials/forms/select.html

@@ -9,7 +9,7 @@
         {{/error}}
     </label>
     {{#isPageHeading}}</h1>{{/isPageHeading}}
-    <select id="{{id}}" class="govuk-select{{#className}} {{className}}{{/className}}{{#error}} invalid-input{{/error}}" name="{{id}}" aria-required="{{required}}">
+    <select id="{{id}}" class="govuk-select{{#className}} {{className}}{{/className}}{{#error}} govuk-select—error{{/error}}" name="{{id}}" aria-required="{{required}}">
     {{#options}}
         <option value="{{value}}" {{#selected}}selected{{/selected}}>{{label}}</option>
     {{/options}}

package/frontend/template-mixins/partials/forms/textarea-group.html

@@ -2,7 +2,7 @@
 <div class="govuk-character-count" data-module="govuk-character-count" data-maxlength="{{maxlength}}">
 {{/maxlength}}
 <div id="{{id}}-group" class="{{#compound}}form-group-compound {{/compound}}{{#formGroupClassName}}{{formGroupClassName}}{{/formGroupClassName}}{{#error}} govuk-form-group--error{{/error}}">
-    {{#isPageHeading}}<h1 class="govuk-label-wrapper">{{/isPageHeading}}<label for="{{id}}" class="{{labelClassName}}">
+    {{#isPageHeading}}<h1 class="govuk-label-wrapper">{{/isPageHeading}}<label for="{{id}}" class="{{labelClassName}}{{#isPageHeading}}govuk-label--l{{/isPageHeading}}">
         {{{label}}}
         {{#error}} 
         <p id="{{id}}-error" class="govuk-error-message">
@@ -16,7 +16,7 @@
     <textarea
         name="{{id}}"
         id="{{id}}"
-        class="govuk-textarea{{#className}} {{className}}{{/className}} {{#maxlength}}maxlength{{/maxlength}}{{#error}} invalid-input{{/error}}"
+        class="govuk-textarea{{#className}} {{className}}{{/className}} {{#maxlength}}maxlength{{/maxlength}}{{#error}} govuk-input—error{{/error}}"
         aria-required="{{required}}"
         {{#maxlength}} maxlength="{{maxlength}}"{{/maxlength}}
         {{#attributes}}

package/frontend/themes/gov-uk/styles/modules/_validation.scss

@@ -25,7 +25,7 @@
 .govuk-form-group--error {
     box-sizing: border-box;
     padding-left: $gutter-half - $validation-bdr-size;
-    border-left: $validation-bdr-size-lg solid $error-colour;
+    //border-left: $validation-bdr-size-lg solid $error-colour;
 
     &:focus {
         outline: $focus-outline;
@@ -42,7 +42,7 @@
         margin-bottom: 0.5em;
     }
     @include bold-19;
-    color: $error-colour;
+    //color: $error-colour;
 }
 
 .invalid-input,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "hof",
   "description": "A bootstrap for HOF projects",
-  "version": "20.0.0-beta.16",
+  "version": "20.0.0-beta.19",
   "license": "MIT",
   "main": "index.js",
   "author": "HomeOffice",

package/sandbox/apps/sandbox/translations/en/default.json

@@ -0,0 +1,203 @@
+{
+  "fields": {
+    "landing-page-radio": {
+      "legend": "Which form would you like to explore?",
+      "hint": "Choose one of the options below and press continue.",
+      "options": {
+        "basic-form": {
+          "label": "Basic form"
+        },
+        "complex-form": {
+          "label": "Complex form"
+        },
+        "build-your-own-form": {
+          "label": "Build your own form"
+        }
+      }
+    },
+    "name": {
+      "label": "What is your full name?"
+    },
+    "dateOfBirth": {
+      "legend": "What is your date of birth?",
+      "hint": "For example, 31 10 1990"
+    },
+    "building": {
+      "label": "Building and street"
+    },
+    "street": {
+      "label": "Address line 2"
+    },
+    "townOrCity": {
+      "label": "Town or city"
+    },
+    "postcode": {
+      "label": "Postcode"
+    },
+    "incomeTypes": {
+      "label": "Sources of income",
+      "legend": "Select the options where you receive income from",
+      "hint": "Select all options that apply to you.",
+      "options": {
+        "salary": {
+          "label": "Salary"
+        },
+        "universal_credit": {
+          "label": "Universal Credit"
+        },
+        "child_benefit": {
+          "label": "Child Benefit"
+        },
+        "housing_benefit": {
+          "label": "Housing Benefit"
+        },
+        "other": {
+          "label": "Other"
+        }
+      }
+    },
+    "countryOfHearing": {
+      "legend": "What country was the appeal lodged?",
+      "options": {
+        "englandAndWales": {
+          "label": "England and Wales"
+        },
+        "scotland": {
+          "label": "Scotland"
+        },
+        "northernIreland": {
+          "label": "Northern Ireland"
+        }
+      }
+    },
+    "email": {
+      "label": "Enter your email address"
+    },
+    "phone": {
+      "label": "Phone number",
+      "hint": "International phone numbers require the international dialling code, for example +33235066182"
+    },
+    "int-phone-number": {
+      "legend": "International phone number"
+    },
+    "complaintDetails": {
+      "label": "Complaint details",
+      "hint": "Briefly summarise your complaint. Include anything that can help our investigation."
+    },
+    "countrySelect": {
+      "label": "Which country are you based in?",
+      "hint": "Start to type the country name and options will appear"
+    },
+    "appealStages": {
+      "label": "Appeal stage",
+      "hint": "Choose an appeal stage from the drop down menu",
+      "options": {
+        "null": "Select..."
+      }
+    }
+  },
+  "journey": {
+    "header": "HOF Bootstrap Sandbox Form",
+    "confirmation": {
+      "details": "Your reference number <br><strong>HDJ2123F</strong>"
+    }
+  },
+  "pages": {
+    "landing-page": {
+      "header": "Landing page"
+    },
+    "build-your-own-form": {
+      "title": "Build your own form",
+      "subheader": "Access the build your own form guidance link"
+    },
+    "address": {
+      "header": "What is your address in the UK?",
+      "intro": "If you have no fixed address, enter an address where we can contact you."
+    },
+    "phone-number": {
+      "header": "Enter your phone number"
+    },
+    "confirm": {
+      "header": "Check your answers before submitting your application.",
+      "sections": {
+        "applicantsDetails": {
+          "header": "Applicant's details"
+        },
+        "address": {
+          "header": "Address"
+        },
+        "income": {
+          "header": "Income"
+        },
+        "appealDetails": {
+          "header": "Appeal details"
+        },
+        "countrySelect": {
+          "header": "Country of residence"
+        },
+        "contactDetails": {
+          "header": "Contact details"
+        },
+        "complaintDetails": {
+          "header": "Complaint details"
+        }
+      }
+    },
+    "confirmation": {
+      "title": "Application sent",
+      "alert": "Application sent",
+      "subheader": "What happens next",
+      "content": "We’ll contact you with the decision of your application or if we need more information from you."
+    }
+  },
+  "validation": {
+    "landing-page-radio": {
+      "required": "Select an option below and press continue"
+    },
+    "name": {
+      "default": "Enter your full name"
+    },
+    "dateOfBirth": {
+      "default": "Enter your date of birth in the correct format; for example, 31 10 1990",
+      "after": "Enter a date after 1 1 1900",
+      "before": "Enter a date that is in the past"
+    },
+    "building": {
+      "default": "Enter details of your building and street"
+    },
+    "townOrCity": {
+      "default": "Enter a town or city",
+      "regex": "Enter a town or city without including digits"
+    },
+    "postcode": {
+      "default": "Enter your postcode"
+    },
+    "incomeTypes": {
+      "default": "Select all options that apply to you."
+    },
+    "countryOfHearing": {
+      "default": "Select where the appeal hearing is to be held"
+    },
+    "countrySelect": {
+      "default": "Enter a valid country of residence",
+      "required": "Enter your country of residence"
+    },
+    "email": {
+      "default": "Enter your email address in the correct format"
+    },
+    "phone": {
+      "default": "Enter your phone number"
+    },
+    "int-phone-number": {
+      "required": "Enter an international phone number",
+      "internationalPhoneNumber": "Enter a valid international phone number"
+    },
+    "complaintDetails": {
+      "default": "Enter details about why you are making a complaint",
+      "maxlength": "Keep to the {{maxlength}} character limit"
+    },
+    "appealStages": {
+      "required": "Select an appeal stage from the list"
+    }
+  }
+}