Add optional input field illustration feather icon

This commit is contained in:
Alice Gaudon 2020-09-10 16:18:11 +02:00
parent b12d104c78
commit d3e3a86855
1 changed files with 47 additions and 36 deletions

View File

@ -32,7 +32,7 @@
<input type="hidden" name="csrf" value="{{ getCSRFToken() }}"> <input type="hidden" name="csrf" value="{{ getCSRFToken() }}">
{% endmacro %} {% endmacro %}
{% macro field(_locals, type, name, value, placeholder, hint, validation_attributes='', extraData='') %} {% macro field(_locals, type, name, value, placeholder, hint, validation_attributes='', extraData='', icon=null) %}
{% set validation = _locals.validation() %} {% set validation = _locals.validation() %}
{% set validation = validation[name] if validation[name] or null %} {% set validation = validation[name] if validation[name] or null %}
{% set previousFormData = _locals.previousFormData() %} {% set previousFormData = _locals.previousFormData() %}
@ -45,42 +45,53 @@
<input type="hidden" name="{{ name }}" value="{{ value }}"> <input type="hidden" name="{{ name }}" value="{{ value }}">
{% else %} {% else %}
<div class="form-field{{ ' inline' if type == 'checkbox' }}"> <div class="form-field{{ ' inline' if type == 'checkbox' }}">
{% if type == 'duration' %} <div class="control">
<div class="input-group"> {% if icon != null %}
{% for f in extraData %} {% if icon.startsWith('fa') %}
<div class="time-input"> <i class="{{ icon }} feather icon"></i>
{% if previousFormData[name] %} {% else %}
{% set v = value[f] %} <i data-feather="{{ icon }}" class="icon"></i>
{% else %} {% endif %}
{% set v = (value % 60) if f == 's' else (((value - value % 60) / 60 % 60) if f == 'm' else ((value - value % 3600) / 3600 if f == 'h')) %} {% endif %}
{% endif %}
<input type="number" name="{{ name }}[{{ f }}]" id="field-{{ name }}-{{ f }}" {% if type == 'duration' %}
value="{{ v }}" <div class="input-group">
min="0" {{ 'max=60' if (f == 's' or f == 'm') }} {% for f in extraData %}
{{ validation_attributes }}> <div class="time-input">
<label for="field-{{ name }}-{{ f }}">{{ f }}</label> {% if previousFormData[name] %}
</div> {% set v = value[f] %}
{% endfor %} {% else %}
</div> {% set v = (value % 60) if f == 's' else (((value - value % 60) / 60 % 60) if f == 'm' else ((value - value % 3600) / 3600 if f == 'h')) %}
{% elseif type == 'select' %} {% endif %}
<select name="{{ name }}" id="field-{{ name }}" {{ validation_attributes|safe }}> <input type="number" name="{{ name }}[{{ f }}]" id="field-{{ name }}-{{ f }}"
{% for option in extraData %} value="{{ v }}"
<option value="{% if option.display === undefined or option.value !== undefined %}{{ option.value | default(option) }}{% endif %}" min="0" {{ 'max=60' if (f == 's' or f == 'm') }}
{{ 'selected' if value == (option.value | default(option)) }}>{{ option.display | default(option) }}</option> {{ validation_attributes }}>
{% endfor %} <label for="field-{{ name }}-{{ f }}">{{ f }}</label>
</select> </div>
<i data-feather="chevron-down"></i> {% endfor %}
{% elseif type == 'textarea' %} </div>
<textarea name="{{ name }}" id="field-{{ name }}" {% elseif type == 'select' %}
{{ validation_attributes|safe }}>{{ value }}</textarea> <select name="{{ name }}" id="field-{{ name }}" {{ validation_attributes|safe }}>
{% else %} {% for option in extraData %}
<input type="{{ type }}" name="{{ name }}" id="field-{{ name }}" <option value="{% if option.display === undefined or option.value !== undefined %}{{ option.value | default(option) }}{% endif %}"
{% if type != 'checkbox' %} value="{{ value }}" {% endif %} {{ 'selected' if value == (option.value | default(option)) }}>{{ option.display | default(option) }}</option>
{{ 'checked' if (type == 'checkbox' and value == 'on') }} {% endfor %}
{{ validation_attributes|safe }}> </select>
{% endif %} <i data-feather="chevron-down"></i>
{% elseif type == 'textarea' %}
<textarea name="{{ name }}" id="field-{{ name }}"
{{ validation_attributes|safe }}>{{ value }}</textarea>
{% else %}
<input type="{{ type }}" name="{{ name }}" id="field-{{ name }}"
{% if type != 'checkbox' %} value="{{ value }}" {% endif %}
{{ 'checked' if (type == 'checkbox' and value == 'on') }}
{{ validation_attributes|safe }}>
{% endif %}
<label for="field-{{ name }}{{ '-' + extraData[0] if type == 'duration' }}">{{ placeholder }}</label>
</div>
<label for="field-{{ name }}{{ '-' + extraData[0] if type == 'duration' }}">{{ placeholder }}</label>
{{ fieldError(_locals, name) }} {{ fieldError(_locals, name) }}
{% if hint %} {% if hint %}
<div class="hint"><i data-feather="info"></i> {{ hint }}</div> <div class="hint"><i data-feather="info"></i> {{ hint }}</div>