{% extends 'base.html' %}
{% load static %}

{% block style %}
<style>
	.alert-error {
	  color: red;
      margin-bottom: 5px;
      font-size: medium;
	}
	</style>
{% endblock style %}
	

{% block content %} 
{% if not request.user.is_authenticated %}
	<div class="sign section--bg" data-bg="https://i.ibb.co/rp5sjD9/section.jpg">
		<div class="container">
			<div class="row">
				<div class="col-12">
					<div class="sign__content">
						<!-- authorization form -->
						<form  action="{% url 'login' %}" method="POST" class="sign__form" novalidate>
                            {% csrf_token %}
							<a href="index.html" class="sign__logo">
								<img src="{% static 'img/lc.svg' %}" alt="">
                            </a>
                            {% for field in form %}
							<div class="sign__group">
                                {% if field.errors %}
                                {{ field.errors }}
                                {% endif %}
                                {{ field }}
                            </div>
                            {% endfor %}
                            <button class="sign__btn" type="submit">Login</button>
                            <input type="hidden" name="next" value="{{ next }}">

							<span class="sign__text">Non hai un account? <a href="{% url 'registrazione-profilo' %}">Registrati!</a></span>

							<span class="sign__text"><a href="{% url 'password_reset' %}">Password Dimenticata?</a></span>
						</form>
						<!-- end authorization form -->
					</div>
				</div>
			</div>
		</div>
    </div>
{% else %}

    <div class="container">
        <div class="row">
            <div class="col-12">
                <div class="sign__content">
                    <div class="sign__form">
                        <span class="sign__text">Caro Utente, sei giá loggato!</a></span>
                    </div>
                </div>
            </div>
        </div>
    </div>

{% endif %}
        

    {% endblock content %}
    {% block javascript %}
        <script>
            $(document).ready(function(){
                $('input[type="text"]').addClass('sign__input').attr('placeholder','Nome Utente');
                $('input[type="password"]').addClass('sign__input').attr('placeholder','Password');
                $("ul.errorlist").removeClass('errorlist').addClass('alert-error');
            })
        </script>
    {% endblock javascript %}