{% extends "base.html" %}
{% load crispy_forms_filters %}
{% load i18n %}
{% load static %}

{% load account socialaccount %}

{% block title %}{% trans 'Login' %}{% endblock %}

{% block content %}


    <div class="row">
        <div class="col-12" style="text-align: center">
            <h3>{% trans "Sign In" %}</h3>
        </div>
    </div>


    <div class="row">
        <div class="col-sm-12 col-lg-6 col-md-6 offset-lg-3 offset-md-3">
            <hr>
            <form class="login" method="POST" action="{% url 'account_login' %}">
                {% csrf_token %}
                {{ form | crispy }}

                {% if redirect_field_value %}
                    <input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}"/>
                {% endif %}

                <button class="btn btn-success" type="submit">{% trans "Sign In" %}</button>

                {% if SIGNUP_ENABLED %}
                    <a class="btn btn-secondary" href="{% url 'account_signup' %}">{% trans "Sign Up" %}</a>
                {% endif %}

                {% if EMAIL_ENABLED %}
                    <a class="btn btn-warning float-right d-none d-xl-block d-lg-block"
                       href="{% url 'account_reset_password' %}">{% trans "Reset My Password" %}</a>
                    <p class="d-xl-none d-lg-none">{% trans 'Lost your password?' %} <a
                            href="{% url 'account_reset_password' %}">{% trans "Reset My Password" %}</a></p>
                {% endif %}
            </form>
        </div>
    </div>

    {% get_providers as socialaccount_providers %}

    {% if socialaccount_providers %}
        <div class="row" style="margin-top: 2vh">
            <div class="col-sm-12 col-lg-6 col-md-6 offset-lg-3 offset-md-3">
                <h5>{% trans "Social Login" %}</h5>
                <span>{% trans 'You can use any of the following providers to sign in.' %}</span>

                <br/>
                <br/>
                <ul class="socialaccount_providers list-unstyled">
                    {% include "socialaccount/snippets/provider_list.html" with process="login" %}
                </ul>


                {% include "socialaccount/snippets/login_extra.html" %}


            </div>
        </div>
    {% endif %}

    <script>
        $('#id_login').focus()
        $('#id_remember').prop('checked', true);
    </script>

{% endblock %}