Remove name-based width logic from date-input component

[kr8n3r]

In https://github.com/alphagov/govuk-frontend/pull/857/files#diff-e94394b2ac1d4f73991af98e4fa34fa3L32 we removed styling which made the year field 4 characters wide, but was coupled to the field's name.

However, to avoid making this a breaking release, we added logic to automatically add the width classes based on the name.

We are now removing this behaviour. Instead, users need pass explicit classes for each field in the items object for the desired width of the input field:

{{ govukDateInput({
  "id": "dob",
  "name": "dob",
  "fieldset": {
    "legend": {
      "text": "What is your date of birth?"
    }
  },
  "items": [
    {
      "name": "day",
      "classes": "govuk-input--width-2"
    },
    {
      "name": "month",
      "classes": "govuk-input--width-2"
    },
    {
      "name": "year",
      "classes": "govuk-input--width-4"
    }
  ]
}) }}

Fixes: #905
Trello ticket: https://trello.com/c/xTcZVm2O/1391-1-remove-name-based-width-logic-from-date-input-component

[joelanman]

This is a tricky problem. Our pattern for dates is to have short fields for day and month, and then a longer field for year.

I understand and agree with this change, it's just a shame that users have to add classes manually to get the standard component. It would be great if they didn't need to do that.

[36degrees]

👍

[36degrees]

Rebased and merged in @igloosi's absence.