digitalmarketplace-frontend/dist/digitalmarketplace/components/list-input/template-with-error-for-specific-fields.html

Digital Marketplace Frontend contains assets and components used in Digital Marketplace projects

<div class="dm-list-input">
<fieldset class="govuk-fieldset" aria-describedby="my-list-3-hint " data-module="dm-list-input">
  <legend class="govuk-fieldset__legend dm-list-input__legend">
    What requirements are essential to carry out the work?
  </legend>
    <div id="my-list-3-hint" class="govuk-hint dm-list-input__hint ">
    Include the technical features of your product, eg graphical workflow, remote access. (Maximum 10 words per feature. Maximum 10 features.)
  </div>
  

  <div class="dm-list-input__item-container" role="region" aria-live="assertive">
<div class="dm-list-input__item dm-list-input__item--visible"><div class="dm-list-input__row">
          <div class="govuk-form-group dm-list-input__form-group">
    <label class="govuk-label dm-list-input__item-label " for="my-list-3">
      <span class="govuk-visually-hidden">What requirements are essential to carry out the work?. Number </span><span class="dm-list-input__counter">1</span>.
    </label>
    <input class="govuk-input govuk-input dm-list-input__item-input" id="my-list-3" name="requirements" type="text" value="Professionally initiate innovative partnerships.">
  </div>
          <button type="button" class="govuk-button govuk-button--secondary dm-list-input__item-remove dm-list-input__item-remove--hidden" data-module="govuk-button">
  Remove <span class="govuk-visually-hidden">entry number <span class="dm-list-input__counter">1</span></span>
</button>
        </div>
      </div>
<div class="dm-list-input__item dm-list-input__item--visible dm-list-input__item--error "><div class="dm-list-input__row">
          <div class="govuk-form-group govuk-form-group--error dm-list-input__form-group">
    <label class="govuk-label dm-list-input__item-label " for="my-list-3-2">
      <span class="govuk-visually-hidden">What requirements are essential to carry out the work?. Number </span><span class="dm-list-input__counter">2</span>.
    </label>
    <p id="my-list-3-2-error" class="govuk-error-message dm-list-input-error-message  ">
      <span class="govuk-visually-hidden">Error:</span> Feature must be 5 words or fewer
    </p>
    <input class="govuk-input govuk-input dm-list-input__item-input govuk-input--error" id="my-list-3-2" name="requirements" type="text" value="Synergistically iterate scalable leadership skills without competitive testing procedures. Quickly envisioneer." aria-describedby="my-list-3-2-error">
  </div>
          <button type="button" class="govuk-button govuk-button--secondary dm-list-input__item-remove dm-list-input__item-remove--hidden" data-module="govuk-button">
  Remove <span class="govuk-visually-hidden">entry number <span class="dm-list-input__counter">2</span></span>
</button>
        </div>
      </div>
<div class="dm-list-input__item dm-list-input__item--visible dm-list-input__item--error "><div class="dm-list-input__row">
          <div class="govuk-form-group govuk-form-group--error dm-list-input__form-group">
    <label class="govuk-label dm-list-input__item-label " for="my-list-3-3">
      <span class="govuk-visually-hidden">What requirements are essential to carry out the work?. Number </span><span class="dm-list-input__counter">3</span>.
    </label>
    <p id="my-list-3-3-error" class="govuk-error-message dm-list-input-error-message  ">
      <span class="govuk-visually-hidden">Error:</span> Enter a number
    </p>
    <input class="govuk-input govuk-input dm-list-input__item-input govuk-input--error" id="my-list-3-3" name="requirements" type="text" value="Saturday Night Fever" aria-describedby="my-list-3-3-error">
  </div>
          <button type="button" class="govuk-button govuk-button--secondary dm-list-input__item-remove dm-list-input__item-remove--hidden" data-module="govuk-button">
  Remove <span class="govuk-visually-hidden">entry number <span class="dm-list-input__counter">3</span></span>
</button>
        </div>
      </div>
  </div>
  <button type="button" class="govuk-button govuk-button--secondary dm-list-input__item-add dm-list-input__item-add--hidden" data-module="govuk-button">
  Add another requirement (<span class="dm-list-input__js-remaining-counter">0</span> remaining)
</button>

</fieldset>
</div>