templates/security/login.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %}Log in!{% endblock %}
  5. {% block body %}
  6. <div class="container mx-auto" style="margin: 150px 0;" id="{{ app.request.get('type') }}">
  7.     <form method="post">
  8.         {% if error %}
  9.             <div class="alert alert-danger">{{ error.messageKey|trans(error.messageData, 'security') }}</div>
  10.         {% endif %}
  12.         {% if app.user %}
  13.             <div class="mb-3">
  14.                 You are logged in as {{ app.user.userIdentifier }}, <a href="{{ path('app_logout') }}">Logout</a>
  15.             </div>
  16.         {% endif %}
  18.         <h1 class="h3 mb-3 font-weight-normal">Je me connecte à mon compte</h1>
  19.         <label for="inputEmail">Email</label>
  20.         <input type="email" value="{{ last_username }}" name="email" id="inputEmail" class="form-control" autocomplete="email" required autofocus><br>
  21.         <label for="inputPassword">Mot de passe</label>
  22.         <div class="input-group">
  23.             <input type="password" name="password" id="inputPassword" class="form-control" autocomplete="current-password" required>
  24.             <button class="btn btn-outline-secondary" type="button" id="togglePassword"><i class="fas fa-eye"></i></button>
  25.         </div>
  26.         <div id="emailHelp" class="form-text"><a href="forgot-Password.php" style="color: #F6249D;">Mot de passe oublié ?</a></div>
  27.         <input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">
  28.         <br>
  29.         {#
  30.             Uncomment this section and add a remember_me option below your firewall to activate remember me functionality.
  31.             See https://symfony.com/doc/current/security/remember_me.html
  33.             <div class="checkbox mb-3">
  34.                 <label>
  35.                     <input type="checkbox" name="_remember_me"> Remember me
  36.                 </label>
  37.             </div>
  38.         #}
  39.         <button class="btn btn-lg btn-primary" type="submit">Connexion</button>
  40.     </form>
  41. </div>
  43. <script>
  44. document.addEventListener('DOMContentLoaded', function() {
  45.     document.getElementById('togglePassword').addEventListener('click', function() {
  46.         var passwordField = document.getElementById('inputPassword');
  47.         var type = passwordField.getAttribute('type') === 'password' ? 'text' : 'password';
  48.         passwordField.setAttribute('type', type);
  49.         this.querySelector('i').classList.toggle('fa-eye-slash');
  50.     });
  51. });
  53. </script>
  54. {% endblock %}