{% extends request.resolver_match.app.base_template_name|default:'viewflow/base_page.html' %}
{% load i18n viewflow %}

{% block content %}
  <div class="mdc-layout-grid vf-page__grid">
    <div class="mdc-layout-grid__inner vf-page__grid-inner">
      {% block confirm-cell %}
        <div class="mdc-layout-grid__cell {% block detail-cell-span %}mdc-layout-grid__cell--span-10-desktop mdc-layout-grid__cell--span-8-tablet mdc-layout-grid__cell--span-4-phone{% endblock %}">
          <div class="mdc-card vf-card">
            <section class="vf-card__header">
              <h1 class="vf-card__title">{{ view.model|verbose_name_plural|title }}</h1>
              <h2 class="vf-card__breadcrumbs">
                <a href="{% current_viewset_reverse viewset 'list' %}">{{ view.model|verbose_name_plural|title }}</a>
                <a>{% trans 'Import' %}</a>
              </h2>
            </section>
            <vf-form>
              <form class="vf-form" method="POST" data-turbo="false" {% if form.is_multipart %} enctype="multipart/form-data"{% endif %}>
                {% csrf_token %}
                <section class="vf-card__form">
                  <h3 class="vf-card__alert">
                    {% blocktrans with plural_name=view.model|verbose_name_plural %}
                      Import {{ plural_name }}
                    {% endblocktrans %}
                  </h3>
                </section>
                <section class="vf-card__form">
                  {% render form %}
                </section>
                <section class="mdc-card__actions vf-card__actions">
                  <a class="mdc-button mdc-card__action mdc-card__action--button" style="margin-right: auto;" onclick="window.history.back(-1)"><i class="material-icons">arrow_back</i>{% trans "Back" %}  </a>
                  <input class="mdc-button mdc-card__action mdc-card__action--button mdc-button--raised" type="submit" value="{% trans "Import" %}">
                </section>
              </form>
            </vf-form>
          </div>
          </div
      {% endblock confirm-cell %}
    </div>
  </div>
{% endblock content %}