steps_conviction_known_date_with_errors.html

<div class="govuk-form-group govuk-form-group--error app-util--compact-form-group">
  <fieldset class="govuk-fieldset" aria-describedby="steps-conviction-known-date-form-known-date-error steps-conviction-known-date-form-known-date-hint">
    <legend class="govuk-fieldset__legend govuk-fieldset__legend--xl">
      <h1 class="govuk-fieldset__heading"><span class="govuk-caption-xl">Bind over</span>When were you given the order?</h1>
    </legend>

<div class="govuk-hint" id="steps-conviction-known-date-form-known-date-hint">
<p>This is usually the day you were convicted in court.
</p>If you do not know the exact date, you can enter an approximate one. However, if you use an approximate date, your results will be approximate.
<p>For example, 23 9 2018</p>
</div>

<p class="govuk-error-message" id="steps-conviction-known-date-form-known-date-error"><span class="govuk-visually-hidden">Error: </span>Enter the date in the format dd/mm/yyyy</p>
  <div class="govuk-date-input">
    <div class="govuk-date-input__item">
      <div class="govuk-form-group">
        <label class="govuk-label govuk-date-input__label" for="steps-conviction-known-date-form-known-date-field-error">Day</label>
        <input id="steps-conviction-known-date-form-known-date-field-error" class="govuk-input govuk-date-input__input govuk-input--width-2 govuk-input--error" name="steps_conviction_known_date_form[known_date(3i)]" type="text" inputmode="numeric" maxlength="2">
      </div>
    </div>

    <div class="govuk-date-input__item">
      <div class="govuk-form-group">
        <label class="govuk-label govuk-date-input__label" for="steps_conviction_known_date_form_known_date_2i">Month</label>
        <input id="steps_conviction_known_date_form_known_date_2i" class="govuk-input govuk-date-input__input govuk-input--width-2 govuk-input--error" name="steps_conviction_known_date_form[known_date(2i)]" type="text" inputmode="numeric" maxlength="2">
      </div>
    </div>

    <div class="govuk-date-input__item">
      <div class="govuk-form-group">
        <label class="govuk-label govuk-date-input__label" for="steps_conviction_known_date_form_known_date_1i">Year</label>
        <input id="steps_conviction_known_date_form_known_date_1i" class="govuk-input govuk-date-input__input govuk-input--width-4 govuk-input--error" name="steps_conviction_known_date_form[known_date(1i)]" type="text" inputmode="numeric" maxlength="4">
      </div>
    </div>
  </div>
</fieldset>
</div>

<div class="govuk-form-group"><fieldset class="govuk-fieldset"><legend class="govuk-fieldset__legend govuk-fieldset__legend--s govuk-visually-hidden">Approximate date</legend><div class="govuk-checkboxes govuk-checkboxes--small" data-module="govuk-checkboxes">
  <div class="govuk-checkboxes__item"><input id="steps-conviction-known-date-form-approximate-known-date-true-field" class="govuk-checkboxes__input" type="checkbox" value="true" name="steps_conviction_known_date_form[approximate_known_date]"><label for="steps-conviction-known-date-form-approximate-known-date-true-field" class="govuk-label govuk-checkboxes__label">This is not the exact date</label></div>
</div></fieldset></div>