{% load i18n  %}

{% block head %}
    {{ form.media }}
{% endblock %}

{% block body %}
<div class="container">
    <h4>
        {{ form.form_title }}
    </h4>
    {% if form.form_caption is not None %}
    <small>
        {{ form.form_caption }}
    </small>
    {% endif %}
    <form method="post" action="{{ form.action_url }}">
        {% csrf_token %}
        <table class="table">
            <tbody>
                {% for field in form %}
                <tr title="{{ field.help_text }}" class="{% if field.errors %}error{% endif %}">
                    <th scope="row" class="col-sm-3">
                        <div>{{ field.label }}<span class="label-required">{% if field.field.required %}*{% endif %}</span></div>
                        <small>{{ field.help_text }}</small>
                    </th>
                    <td class="col-sm-9">
                        {{ field }}
                        {% for error in field.errors %}
                        <strong>{{ error }}</strong>
                        {% endfor %}
                    </td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
        <small>{% trans 'Fields with * are required.' %}</small>
        <div class="row">
            <div class="col-md">
                <a href="{{ form.cancel_redirect }}">
                    <button class="btn btn-default" type="button" title="{% trans 'Cancel' %}">{% trans 'Cancel' %}</button>
                </a>
            </div>
            <div class="col-md d-flex justify-content-end">
                <button class="btn btn-default" type="submit" title="{% trans 'Save' %}">{% trans 'Save' %}</button>
            </div>
        </div>
    </form>
</div>
{% endblock %}

{% block footer %}
    {{ form.media }}
{% endblock %}