51751ABB-5214-4D7F-AB7F-8A7599AC7751 Created with sketchtool.

Input: Url

100% 
<div class="o-form__field">
    <div class="o-form__fluid">
        <input title="" type="url" class="o-form__input o-form__input--url " placeholder="Ihre Webseite" aria-describedby="input-5" pattern="url" required>
        <label class="o-form__label">Input type: url<span class="required">*</span></label>
    </div>
    <span class="o-form__status o-form__status--warning">
          Dieses Feld muss ausgefüllt werden.
        </span>
    <span class="o-form__info" id="input-5"></span>
</div>
 
<div class="o-form__field">
    <div class="o-form__fluid">
        <input title="{{ title }}" type="{{ type }}"
               class="o-form__input o-form__input--{{ type }} {{ class }}"
               placeholder="{{ placeholder }}"
            {% if Id %} aria-describedby="{{ Id }}"{% endif %}
            {% if pattern %} pattern="{{ pattern }}"{% endif %}
            {% if required %} required{% endif %}>
        {% if label %}
            <label class="o-form__label">{{ label }}{% if required %}<span class="required">*</span>{% endif %}</label>
        {% endif %}
    </div>
    {% if required %}
        <span class="o-form__status o-form__status--warning">
          {{ errortext }}
        </span>
    {% endif %}
    {% if Id %}
        <span class="o-form__info" id="{{ Id }}">{{ description }}</span>
    {% endif %}
</div>
 
{
  "label": "Input type: url",
  "type": "url",
  "placeholder": "Ihre Webseite",
  "Id": "input-5",
  "pattern": "url",
  "required": true,
  "errortext": "Dieses Feld muss ausgefüllt werden.",
  "description": "",
  "title": ""
}

There are no notes for this item.