templates/security/login.html.twig line 1

  1. {% extends 'base.html.twig' %}
  2. {% block title %}Connexion{% endblock %}
  4. {% block body_class %}bg-biologie effect-bg-1 center{% endblock %}
  6. {% block body %}
  7. <div class="container">
  8.     <div class="row justify-content-center">
  9.         <div class="col-12 col-md-8">
  10.             <div class="bg-primary-transparent p-5 my-5">
  11.                 <img src="{{ asset('images/identity/logo_short.png') }}" alt="Logo la brume">
  12.                 <h1>Connexion</h1>
  13.                 <p>Pas encore de compte ? <a href="{{ path('app_register') }}">Inscription</a></p>
  15.                 <form method="post">
  16.                     <input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">
  17.                     {% if error %}
  18.                         <div class="text-danger">{{ error.messageKey|trans(error.messageData, 'security') }}</div>
  19.                     {% endif %}
  20.                     <div class="form-group">
  21.                         <label for="inputEmail">Email</label>
  22.                         <input type="email" value="{{ last_username }}" name="email" id="inputEmail" class="form-control" autocomplete="email" required autofocus>
  23.                     </div>
  24.                     <div class="form-group password">
  25.                         <label for="inputPassword">Mot de passe</label>
  26.                         <input type="password" name="password" id="inputPassword" class="ControlInput--password form-control" autocomplete="current-password" required>
  27.                         <div class="Control-label--showPassword">
  28.                             <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="32" height="32" class="svg-toggle-password" title="Toggle Password Security">
  29.                                 <title>Afficher/Masquer le mot de passe</title>
  30.                                 <path d="M24,9A23.654,23.654,0,0,0,2,24a23.633,23.633,0,0,0,44,0A23.643,23.643,0,0,0,24,9Zm0,25A10,10,0,1,1,34,24,10,10,0,0,1,24,34Zm0-16a6,6,0,1,0,6,6A6,6,0,0,0,24,18Z"></path>
  31.                                 <rect x="20.133" y="2.117" height="44" transform="translate(23.536 -8.587) rotate(45)" class="closed-eye"></rect>
  32.                                 <rect x="22" y="3.984" width="4" height="44" transform="translate(25.403 -9.36) rotate(45)" style="fill:#fff" class="closed-eye"></rect>
  33.                             </svg>
  34.                         </div>
  35.                     </div>
  36.                     <div class="form-group">
  37.                         <input type="checkbox" name="_remember_me" id="_remember_me" class="me-2"><label for="_remember_me"> Me garder connecté</label>
  38.                     </div>
  39.                     <button class="btn" type="submit">Connexion</button>
  40.                 </form>
  41.             </div>
  42.         </div>
  43.     </div>
  44. </div>
  45. {% endblock %}
  47. {% block footer_scripts %}
  48. <script>
  49.     $(document).ready(function() {
  50.         $(".Control-label--showPassword").click(function() {
  51.             $(".closed-eye").toggleClass("open");
  52.             let input = $(".ControlInput--password");
  53.             if (input.attr("type") == "password") {
  54.                 input.attr("type", "text");
  55.             } else {
  56.                 input.attr("type", "password");
  57.             }
  58.         });
  59.     });
  60. </script>
  61. {% endblock %}