<!-- Page d'authentification -->
<div class="section center-align">
  <h4>Authentification</h4>
</div>
<div class="divider"></div>

<!-- Introduction -->
<div class="section center-align">
  <div class="row">
    <h5>Bienvenue sur EasyTransport - Qui êtes vous ?</h5>
  </div>
</div>

<!-- Formulaire d'authentification -->
<div class="section center-align">
  <form id="authForm">

    <div class="row">
      <h6 class="red-text text-darken-4">Veuillez renseigner votre matricule :</h6>
    </div>

    <div class="row">
      <div class="col s4 offset-s4">
        <label for="matricule" class="left">Matricule:</label>
        <input placeholder="S123456" type="text" id="matricule">
        <div id="matricule-error" class="red-text" style="display:none;"></div>
      </div>
    </div>

    <div class="row">
      <button class="btn" type="submit" name="Continuer">Continuer</button>
    </div>

  </form>
</div>

<!-- MODALS -->
<!-- Modal pour erreur de matricule -->
<div id="wrongMatriculeModal" class="modal">
  <div class="modal-content center-align">

    <div class="row">
      <h5>Nous n'avons pas trouvé le matricule <span id="displayedMatricule"
          class="grey-text text-darken-2">XXXXXX</span></h5>
      <h6 class="red-text text-darken-4">Veuillez contacter un des administrateurs de la plateforme :</h6>
    </div>

    <div class="row">
      <table id="adminList" class="centered">
        <tbody>
          <!-- données auth.js -->
        </tbody>
      </table>
    </div>
  </div>

  <div class="modal-footer">
    <a class="modal-close waves-effect waves-green btn-flat">Fermer</a>
  </div>
</div>

<!-- Script pour la page auth.js -->
<script src="/js/auth.js"></script>