<div class="form-block form-block--input form-block--input-example">
    <div class="form-input form-input--password">
        <label for="input-example">This is an input</label>
        <input id="input-example" name="input-example" type="password" placeholder="This is a placeholder">
    </div>
</div>
<div class="form-block form-block--input form-block--{{ formBlockName }}{% if formBlockValidationMessage %} has-error{% endif %}">
	<div class="form-input form-input--{{ formBlockInputType|default('text') }}">
		<label for="{{ formBlockName }}">{{ formBlockLabel }}</label>
		<input id="{{ formBlockName }}" name="{{ formBlockName }}" type="{{ formBlockInputType|default('text') }}"{% if formBlockInputAttributes %}{% for key, value in formBlockInputAttributes %} {{ key }}="{{ value }}"{% endfor %}{% endif %}>
	</div>
	{% if formBlockValidationMessage %}
	<div class="form-block-validation-message">
		<p>{{ formBlockValidationMessage }}</p>
	</div>
	{% endif %}
</div>
{
  "formBlockInputType": "password",
  "formBlockLabel": "This is an input",
  "formBlockName": "input-example",
  "formBlockInputAttributes": {
    "placeholder": "This is a placeholder"
  }
}
  • Handle: @form-block-input--password
  • Preview:
  • Filesystem Path: resources/components/02-units/form-blocks/input/input.twig

Form Blocks

Purpose: Used to allow the user to input information.