{% extends 'preinscription/main.html' %}
{% load static %}
{% block head %}
<link href="{% static 'inscription/assets/css/style.css' %}" rel="stylesheet">
{% endblock head %}
{% block title %} Connexion{% endblock title %}

{% block content %}
<!-- ======= Breadcrumbs ======= -->
<section id="breadcrumbs" class="breadcrumbs">
  <div class="container">
    <ol>
      <li><a href="#">Accueil</a></li>
      <li>Connexion espace candidat</li>
    </ol>
    <h2>Connexion</h2>
  </div>
</section><!-- End Breadcrumbs -->
 <div class="container">
     <div class="row">
         <div class="col-lg-3"></div>
         <div class="col-lg-4">
             <h4>Connexion</h4><hr/><br/>
             <div class="row">
                 <div class="col-lg-12">
                     {% include 'main_app/message.html' %}
                 </div>
             </div>
             <form action="." method="post" class="checkout-form">
                    {% csrf_token %}
                         <div class="form-group ">
                            <label  class="control-label col-lg-4">Email:</label>
                            <input type="text" id="username" name="username" value="" placeholder="Nom d'utilisateur" class="login username-field" autofocus />
                          </div>

                          <div class="form-group ">
                            <label  class="control-label col-lg-4">Mot de passe:</label>
                            <input type="password" id="password" name="password" value="" placeholder="***************" class="login password-field"/>
                          </div><br/>

                         <div class="form-group">
                            <div class="col-lg-offset-2 col-lg-10 form-link">
                             <button type="submit" class="btn btn-success"><i class="bi bi-unlock-fill"></i> connexion</button>
                                &nbsp;&nbsp;&nbsp;<a style="text-decoration:none;" class="btn btn-primary" href="{% url 'Scolarite:register' %}"><i class="bi bi-arrow-right-square-fill"></i> inscription</a>
                            </div>
                          </div>

                </form><br/><br/>
         </div>
         <div class="col-lg-3"></div>
     </div>
 </div><br/><br/>
{% endblock content %}
{% block script %}
<script>
var form_fields = document.getElementsByTagName('input')
    for (var field in form_fields){
        form_fields[field].className += ' form-control'
    }
</script>
{% endblock script %}