Lunds universitet - Style Guide

Date 

<div class="form-group">
    <label class=" w-100">
    Date Label
    <div class="input-group">
      <div class="input-group-prepend">
        <span class="input-group-text bg-transparent text-bronze"><i class="fal fa-calendar-alt  fa-lg"></i>
</span>
      </div>
      <input type="date" class="form-control" name="date" placeholder="YYYY-MM-DD" pattern="'\d{4}-\d{2}-\d{2}" >
    </div>
  </label>
</div>
 
<div class="form-group{{modifiers modifiers}}">
  <label class="{{modifiers label-modifiers}}">
    {{label}}
    <div class="input-group">
      <div class="input-group-prepend">
        <span class="input-group-text bg-transparent text-bronze">{{render "@icon--date"}}</span>
      </div>
      <input type="date" class="form-control" name="{{name}}"{{#if value}} value="{{value}}"{{/if}}{{#if placeholder}} placeholder="{{placeholder}}"{{/if}} pattern="'\d{4}-\d{2}-\d{2}" {{#if required}} required{{/if}}{{#if disabled}} disabled{{/if}}>
    </div>
  </label>
  {{#if help}}
    {{render "@form-help" help}}
  {{/if}}
</div>
 
{
  "name": "date",
  "label": "Date Label",
  "label-modifiers": [
    "w-100"
  ],
  "placeholder": "YYYY-MM-DD"
}

There are no notes for this item.