{% extends "registration/reg_base.html" %}
{% load i18n %}
{% block head_title %}{% translate "Connexion" %}{% endblock head_title %}
{% block content %}
    <div class="d-flex flex-column min-vh-100 justify-content-center align-items-center">
        <div class="card" style="margin: 2em">
            <div class="card-body">
                <h5 class="card-title">{% translate MODSHIB_FORMS_TITLE %}</h5>
                <h6 class="card-subtitle mb-2 text-muted">{% translate "Connexion" %}</h6>
                {% if MODSHIB_SHOW_SSO_LOGIN %}
                <div class="card-text d-grid gap-2">
                    <a href="{% url "modshib_sso" %}{% if 'next' in request.GET %}?next={{ request.GET.next }}{% endif %}" class="btn btn-primary">{% translate MODSHIB_SSO_SUBMIT_LABEL %}</a>
                </div>
                    {% if MODSHIB_SHOW_LOCAL_LOGIN %}
                    <div class="card-text" style="margin-top: 1em;margin-bottom: 1em;">
                        ou:
                    </div>
                    {% endif %}
                {% endif %}
                {% if MODSHIB_SHOW_LOCAL_LOGIN %}
                <div class="card-text" id="localForm">
                    <form method="post" class="d-grid gap-2">
                        {% csrf_token %}
                        {% if form.errors %}
                            <div class="alert alert-danger" role="alert">
                                {% translate "Échec de la connexion" %}
                            </div>
                        {% endif %}
                        <table class="table">
                            <tr>
                                <th><label for="id_username">{% translate "Utilisateur" %}</label></th>
                                <td><input type="text"
                                           class="form-control"
                                           name="username"
                                           autofocus=""
                                           autocapitalize="none"
                                           autocomplete="username"
                                           maxlength="150"
                                           required=""
                                           id="id_username"
                                           value="{% if form.username.value %}{{ form.username.value}}{% endif %}"></td>
                            </tr>
                            <tr>
                                <th><label for="id_password">{% translate "Mot de passe" %}</label></th>
                                <td><input type="password"
                                           class="form-control"
                                           name="password"
                                           autocomplete="current-password"
                                           required=""
                                           id="id_password"
                                           value="{% if form.password.value %}{{ form.password.value}}{% endif %}"></td>
                            </tr>
                        </table>
                        <button class="btn btn-secondary" type="submit">{% translate MODSHIB_LOCAL_SUBMIT_LABEL %}</button>
                    </form>
                </div>
                {% endif %}
            </div>
        </div>
    </div>
{% endblock content %}