<!-- Default -->
<input type="text" placeholder="Input text" id="some-id" />
<!-- Fill White -->
<input type="text" placeholder="Fill white" class="fill-white" id="some-id" />
<!-- Search -->
<input type="search" placeholder="Input search" id="some-id" />
<!-- Password -->
<input type="password" placeholder="Input password" id="some-id" />
<!-- Error -->
<input type="text" placeholder="Input error" class="input-error" id="some-id" />
<!-- Icon Before -->
<span class="input-icon-overlay icon-chevron-right icon-before"> <input type="text"
placeholder="Icon before"
id="some-id"
/>
</span>
<!-- Icon After -->
<span class="input-icon-overlay icon-magnifying-glass icon-link icon-after"> <input type="text"
placeholder="Icon after"
id="some-id"
/>
</span>
{% set input %}
<input type="{{ type }}"
{{ placeholder ? 'placeholder="' ~ placeholder ~ '"' }}
{{ value ? 'value="' ~ value ~ '"' }}
{{ class ? 'class="' ~ class ~ '"' }}
{{ id ? 'id="' ~ id ~ '"' }}
{{ attr ? attr }} />
{% endset %}
{% if overlay_icon %}
<span class="input-icon-overlay {{ overlay_icon }}">{{ input }}</span>
{% else %}
{{ input }}
{% endif %}
/* Default */
{
"type": "text",
"placeholder": "Input text",
"value": null,
"id": "some-id"
}
/* Fill White */
{
"type": "text",
"placeholder": "Fill white",
"value": null,
"id": "some-id",
"class": "fill-white"
}
/* Search */
{
"type": "search",
"placeholder": "Input search",
"value": null,
"id": "some-id"
}
/* Password */
{
"type": "password",
"placeholder": "Input password",
"value": null,
"id": "some-id"
}
/* Error */
{
"type": "text",
"placeholder": "Input error",
"value": null,
"id": "some-id",
"class": "input-error"
}
/* Icon Before */
{
"type": "text",
"placeholder": "Icon before",
"value": null,
"id": "some-id",
"overlay_icon": "icon-chevron-right icon-before"
}
/* Icon After */
{
"type": "text",
"placeholder": "Icon after",
"value": null,
"id": "some-id",
"overlay_icon": "icon-magnifying-glass icon-link icon-after"
}
There are no notes for this item.