{% load foundation %}
{% load i18n %}

<div class="reveal large" id="author" data-reveal data-animation-in="slide-in-up"
     data-animation-out="slide-out-down">
    <div class="card">
        <div class="card-divider">
            <h4><i class="fa fa-user">&nbsp;</i>{% trans "Add New Author" %}</h4>
        </div>
        <div class="card-section">
            <button class="close-button" data-close aria-label="Close reveal" type="button">
                <span aria-hidden="true">&times;</span>
            </button>
            {% include "admin/elements/forms/errors.html" with form=form %}
            <form method="POST">
                {% csrf_token %}
                <div class="row">
                    <div class="large-3 columns">
                        {{ form.salutation|foundation }}
                    </div>
                    <div class="large-3 columns">
                        {{ form.first_name|foundation }}
                    </div>
                    <div class="large-3 columns">
                        {{ form.middle_name|foundation }}
                    </div>
                    <div class="large-3 columns">
                        {{ form.last_name|foundation }}
                    </div>

                    <div class="large-12 columns">
                        {{ form.biography|foundation }}
                    </div>

                    <div class="large-4 columns">
                        {{ form.institution|foundation }}
                    </div>
                    <div class="large-4 columns">
                        {{ form.department|foundation }}
                    </div>
                    <div class="large-4 columns">
                        {{ form.country|foundation }}
                    </div>

                    <div class="large-4 columns">
                        {{ form.twitter|foundation }}
                    </div>
                    <div class="large-4 columns">
                        {{ form.linkedin|foundation }}
                    </div>
                    <div class="large-4 columns">
                        {{ form.website|foundation }}
                    </div>

                    <div class="large-6 columns">
                        {{ form.orcid|foundation }}
                    </div>
                    <div class="large-6 columns">
                        {{ form.email|foundation }}
                    </div>
                </div>

                <button class="success button pull-right" type="submit" name="add_author"><i class="fa fa-user">
                    &nbsp;</i>{% trans "Add Author" %}
                </button>
            </form>
        </div>
    </div>
</div>