ui: (pf4) update forms

This commit is contained in:
Jens Langhammer 2020-06-09 13:39:35 +02:00
parent d6b9e67e78
commit b86b36f947
2 changed files with 66 additions and 50 deletions

View File

@ -35,6 +35,7 @@
{% block beneath_form %} {% block beneath_form %}
{% endblock %} {% endblock %}
<div class="pf-c-form__group pf-m-action"> <div class="pf-c-form__group pf-m-action">
<div class="pf-c-form__group-control">
<div class="pf-c-form__horizontal-group"> <div class="pf-c-form__horizontal-group">
<div class="pf-c-form__actions"> <div class="pf-c-form__actions">
<input class="pf-c-button pf-m-primary" type="submit" value="{% block action %}{% endblock %}" /> <input class="pf-c-button pf-m-primary" type="submit" value="{% block action %}{% endblock %}" />
@ -42,6 +43,7 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</form> </form>
</div> </div>
</div> </div>

View File

@ -5,12 +5,15 @@
{% for field in form %} {% for field in form %}
<div class="pf-c-form__group {% if field.errors %} has-error {% endif %}"> <div class="pf-c-form__group {% if field.errors %} has-error {% endif %}">
{% if field.field.widget|fieldtype == 'RadioSelect' %} {% if field.field.widget|fieldtype == 'RadioSelect' %}
<div class="pf-c-form__group-label">
<label class="pf-c-form__label" for="{{ field.name }}-{{ forloop.counter0 }}"> <label class="pf-c-form__label" for="{{ field.name }}-{{ forloop.counter0 }}">
<span class="pf-c-form__label-text">{{ field.label }}</span> <span class="pf-c-form__label-text">{{ field.label }}</span>
{% if field.field.required %} {% if field.field.required %}
<span class="pf-c-form__label-required" aria-hidden="true">&#42;</span> <span class="pf-c-form__label-required" aria-hidden="true">&#42;</span>
{% endif %} {% endif %}
</label> </label>
</div>
<div class="pf-c-form__group-control">
{% for c in field %} {% for c in field %}
<div class="radio col-sm-10"> <div class="radio col-sm-10">
<input type="radio" id="{{ field.name }}-{{ forloop.counter0 }}" <input type="radio" id="{{ field.name }}-{{ forloop.counter0 }}"
@ -22,20 +25,26 @@
<p class="pf-c-form__helper-text">{{ field.help_text }}</p> <p class="pf-c-form__helper-text">{{ field.help_text }}</p>
{% endif %} {% endif %}
{% endfor %} {% endfor %}
</div>
{% elif field.field.widget|fieldtype == 'Select' %} {% elif field.field.widget|fieldtype == 'Select' %}
<div class="pf-c-form__group-label">
<label class="pf-c-form__label" for="{{ field.name }}-{{ forloop.counter0 }}"> <label class="pf-c-form__label" for="{{ field.name }}-{{ forloop.counter0 }}">
<span class="pf-c-form__label-text">{{ field.label }}</span> <span class="pf-c-form__label-text">{{ field.label }}</span>
{% if field.field.required %} {% if field.field.required %}
<span class="pf-c-form__label-required" aria-hidden="true">&#42;</span> <span class="pf-c-form__label-required" aria-hidden="true">&#42;</span>
{% endif %} {% endif %}
</label> </label>
</div>
<div class="pf-c-form__group-control">
<div class="pf-c-form__horizontal-group"> <div class="pf-c-form__horizontal-group">
{{ field|css_class:"pf-c-form-control" }} {{ field|css_class:"pf-c-form-control" }}
{% if field.help_text %} {% if field.help_text %}
<p class="pf-c-form__helper-text">{{ field.help_text|safe }}</p> <p class="pf-c-form__helper-text">{{ field.help_text|safe }}</p>
{% endif %} {% endif %}
</div> </div>
</div>
{% elif field.field.widget|fieldtype == 'CheckboxInput' %} {% elif field.field.widget|fieldtype == 'CheckboxInput' %}
<div class="pf-c-form__group-control">
<div class="pf-c-form__horizontal-group"> <div class="pf-c-form__horizontal-group">
<div class="pf-c-check"> <div class="pf-c-check">
{{ field|css_class:"pf-c-check__input" }} {{ field|css_class:"pf-c-check__input" }}
@ -45,19 +54,24 @@
<p class="pf-c-form__helper-text">{{ field.help_text|safe }}</p> <p class="pf-c-form__helper-text">{{ field.help_text|safe }}</p>
{% endif %} {% endif %}
</div> </div>
</div>
{% else %} {% else %}
<div class="pf-c-form__group-label">
<label class="pf-c-form__label" for="{{ field.name }}-{{ forloop.counter0 }}"> <label class="pf-c-form__label" for="{{ field.name }}-{{ forloop.counter0 }}">
<span class="pf-c-form__label-text">{{ field.label }}</span> <span class="pf-c-form__label-text">{{ field.label }}</span>
{% if field.field.required %} {% if field.field.required %}
<span class="pf-c-form__label-required" aria-hidden="true">&#42;</span> <span class="pf-c-form__label-required" aria-hidden="true">&#42;</span>
{% endif %} {% endif %}
</label> </label>
</div>
<div class="pf-c-form__group-control">
<div class="c-form__horizontal-group"> <div class="c-form__horizontal-group">
{{ field|css_class:'pf-c-form-control' }} {{ field|css_class:'pf-c-form-control' }}
{% if field.help_text %} {% if field.help_text %}
<p class="pf-c-form__helper-text">{{ field.help_text|safe }}</p> <p class="pf-c-form__helper-text">{{ field.help_text|safe }}</p>
{% endif %} {% endif %}
</div> </div>
</div>
{% endif %} {% endif %}
{% for error in field.errors %} {% for error in field.errors %}
<p class="pf-c-form__helper-text pf-m-error"> <p class="pf-c-form__helper-text pf-m-error">