templates/security/login.html.twig line 1

  1. {% extends 'base2.html.twig' %}
  3. {% block title %}Connectez-vous !{% endblock %}
  5. {% block body %}
  9.     <section>
  10.       <div class="container mx-auto">
  11.         <div
  12.           class="grid lg:grid-cols-2 grid-cols-1 gap-10 bg-white p-10 items-center rounded-lg"
  13.         >
  14.           <img
  15.             class="w-full lg:block hidden rounded-2xl"
  16.             src="images/commercants2.webp"
  17.             alt=""
  18.           />
  19.           <div class="">
  20.             <div class="text-center mb-6">
  21.               <a href="/">
  22.                 <img
  23.                   class="w-50 mx-auto h-aFlogoututo mb-2"
  24.                   src="../img/bos_logo.png"
  25.                   alt=""
  26.                 />
  27.               </a>
  28.               <h1 class="text-gray-700 text-3xl font-semibold mb-3">
  29.                 Connectez-vous à votre espace
  30.               </h1>
  31.               <p class="text-base text-gray-500 mb-7">
  32.                 Si vous souhaitez vous inscrire
  33.                 <a href="{{ path('app_shop_new') }}" class="text-blue-500 font-medium"
  34.                   >c'est par ici !</a
  35.                 >
  36.               </p>
  37.             </div>
  38.             <form method="post">
  40.                 {% if error %}
  41.                     <div class="alert alert-danger">{{ error.messageKey|trans(error.messageData, 'security') }}</div>
  42.                 {% endif %}
  44.                 {% if app.user %}
  45.                     <div class="mb-3">
  46.                         You are logged in as {{ app.user.userIdentifier }}, <a href="{{ path('app_logout') }}">Logout</a>
  47.                     </div>
  48.                 {% endif %}
  49.     
  50.             <div class="">
  51.               <label for="inputEmail" class="text-gray-700 font-medium mb-1"
  52.                 >Votre email <sup>*</sup></label
  53.               >
  54.               <div class="relative mb-5">
  55.                 <svg
  56.                   xmlns="http://www.w3.org/2000/svg"
  57.                   class="h-5 w-4 text-gray-400 absolute top-1/2 -translate-y-1/2 ml-3"
  58.                   fill="none"
  59.                   viewBox="0 0 24 24"
  60.                   stroke="currentColor"
  61.                   stroke-width="2"
  62.                 >
  63.                   <path
  64.                     stroke-linecap="round"
  65.                     stroke-linejoin="round"
  66.                     d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"
  67.                   />
  68.                 </svg>
  69.                 <input
  70.                   type="email"
  71.                   value="{{ last_username }}" 
  72.                   name="email" 
  73.                   id="inputEmail" 
  74.                   class="border pl-9 border-gray-200 dark:border-gray-800 dark:text-gray-300 rounded-lg dark:bg-foreground py-4 focus:outline-none w-full"
  75.                   placeholder="Entrez votre email"
  76.                   autocomplete="email" 
  77.                   required autofocus
  78.                 />
  79.               </div>
  80.               <label for="inputPassword" class="text-gray-700 font-medium mb-1"
  81.                 >Mot de passe <sup>*</sup></label
  82.               >
  83.               <div class="relative mb-5">
  84.                 <svg
  85.                   class="h-5 w-4 text-gray-400 absolute top-1/2 -translate-y-1/2 ml-3"
  86.                   xmlns="http://www.w3.org/2000/svg"
  87.                   class="h-6 w-6"
  88.                   fill="none"
  89.                   viewBox="0 0 24 24"
  90.                   stroke="currentColor"
  91.                   stroke-width="2"
  92.                 >
  93.                   <path
  94.                     stroke-linecap="round"
  95.                     stroke-linejoin="round"
  96.                     d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"
  97.                   />
  98.                 </svg>
  99.                 <input
  100.                   type="password"
  101.                   name="password" 
  102.                   id="inputPassword" 
  103.                   class="border pl-9 border-gray-200 dark:border-gray-800 dark:text-gray-300 rounded-lg dark:bg-foreground py-4 focus:outline-none w-full"
  104.                   placeholder="Entrez votre mot de passe"
  105.                   autocomplete="current-password" 
  106.                   required    
  107.                 />
  108.               </div>
  110.                 <input type="hidden" name="_csrf_token"
  111.                     value="{{ csrf_token('authenticate') }}"
  112.                 >
  114.               <div class="flex justify-between flex-wrap mb-3">
  115.               {#
  116.               Uncomment this section and add a remember_me option below your firewall to activate remember me functionality.
  117.         See https://symfony.com/doc/current/security/remember_me.html
  119.                 <div class="mb-3">
  120.                   <input
  121.                     type="checkbox"
  122.                     id="vehicle1"
  123.                     name="_remember_me"
  124.                     value="Bike"
  125.                     class="border border-gray-500"
  126.                   />
  127.                   <label for="vehicle1" class="text-gray-500 font-normal">
  128.                     Remember me?</label
  129.                   >
  130.                 </div>
  131.                 #}
  132.                 <a href="{{ path('app_forgot_password_request') }}" class="text-red-500 mb-3">Mot de passe oublié ?</a>
  133.               </div>
  134.               <button
  135.                 type="submit"
  136.                 class="w-full flex justify-center items-center bg-blue-500 hover:bg-blue-600 rounded-lg text-white p-4 mb-7"
  137.               >
  138.                 Se connecter
  139.               </button>
  140.         </form>
  141.       </div>
  142.     </section>
  145. {% endblock %}