templates/security/create_account.html.twig line 1

  1. {% extends 'base.html.twig' %}
  3.     {% block title %}MOPO - Création compte{% endblock %}
  5. {% block body %}
  6.     <div class="section bg-white">
  7.         <h2 class="text-red-600 text-center m-3">Créer un compte</h2>
  8.         <div class="container">
  9.             <div class="row justify-content-center align-items-center">
  10.                 <div class="col-md-12">
  11.                     <div class="dbox text-center m-0">
  12.                         <div class="icon d-flex align-items-center justify-content-center">
  13.                             <span class="fa-solid fa-user-plus"></span>
  14.                         </div>
  15.                     </div>
  16.                 </div>
  17.             </div>
  18.         </div>
  19.         <p class="text-center fw-bold fs-3 m-3 mt-0">Créez-vous un nouveau compte sur MOPO</p>
  20.         <p class="text-center m-3">Vous avez déjà un compte ? <a href="{{ path('login') }}" class="link-red">Connectez-vous</a>
  21.         </p>
  22.     </div>
  23.     <div class="section parallax-bg">
  24.         <div class="container">
  25.             <div class="row justify-content-center">
  26.                 <!--Grid column-->
  27.                 <div class="col-md-6 mb-md-0 mb-5">
  28.                     <section class="bg-white-clear mt-5 mb-5 p-3">
  29.                         {{ form_start(form) }}
  30.                         <div class="row">
  31.                             <div class="col-md-12 col-lg-6 col-sm-12 mt-2">
  32.                                 {{ form_label(form.user_name, 'Prénom', {'label_attr': {'class': 'form-label text-uppercase'}}) }}
  33.                                 {{ form_widget(form.user_name, {'attr': {'class': 'form-control'}}) }}
  34.                                 {{ form_errors(form.user_name) }}
  35.                             </div>
  36.                             <div class="col-md-12 col-lg-6 col-sm-12 mt-2">
  37.                                 {{ form_label(form.user_surname, 'Nom', {'label_attr': {'class': 'form-label text-uppercase'}}) }}
  38.                                 {{ form_widget(form.user_surname, {'attr': {'class': 'form-control'}}) }}
  39.                                 {{ form_errors(form.user_surname) }}
  40.                             </div>
  41.                         </div>
  42.                         <div class="row">
  43.                             <div class="col-12 mt-2">
  44.                                 {{ form_label(form.user_email.first, 'Adresse mail', {'label_attr': {'class': 'form-label text-uppercase'}}) }}
  45.                                 {{ form_widget(form.user_email.first, {'attr': {'class': 'form-control'}}) }}
  46.                                 {{ form_errors(form.user_email.first) }}
  47.                             </div>
  48.                         </div>
  49.                         <div class="row">
  50.                             <div class="col-12 mt-2">
  51.                                 {{ form_label(form.user_email.second, 'Confirmation adresse mail', {'label_attr': {'class': 'form-label text-uppercase'}}) }}
  52.                                 {{ form_widget(form.user_email.second, {'attr': {'class': 'form-control', 'autocomplete':'off', 'onpaste':'return false;'}}) }}
  53.                                 {{ form_errors(form.user_email.second) }}
  54.                             </div>
  55.                         </div>
  56.                         <div class="row">
  57.                             <div class="col-md-12 col-lg-6 col-sm-12 mt-2">
  58.                                 {{ form_label(form.user_password.first, 'Mot de passe', {'label_attr': {'class': 'form-label text-uppercase'}}) }}
  59.                                 <div class="input-group mb-3">
  60.                                     {{ form_widget(form.user_password.first, {'attr': {'class': 'form-control', 'aria-label': 'password', 'aria-describedby': 'button-addon2'}, 'id': 'inputPassword'}) }}
  61.                                     <span class="input-group-text rounded cursor-pointer" id="basic-addon2"
  62.                                           onclick="password_toggle();">
  63.                                       <i class="fa-solid fa-eye" id="show_eye"></i>
  64.                                       <i class="fa-solid fa-eye-slash d-none" id="hide_eye"></i>
  65.                                     </span>
  66.                                 </div>
  67.                             </div>
  68.                             <div class="col-md-12 col-lg-6 col-sm-12 mt-2">
  69.                                 {{ form_label(form.user_password.second, 'Confirmation mot de passe', {'label_attr': {'class': 'form-label text-uppercase'}}) }}
  70.                                 <div class="input-group mb-3">
  71.                                 {{ form_widget(form.user_password.second, {'attr': {'class': 'form-control', 'aria-label': 'password', 'aria-describedby': 'button-addon2', 'onpaste': 'return false;'}, 'id': 'inputPasswordConfirm'}) }}
  72.                                     <span class="input-group-text rounded cursor-pointer" id="basic-addon2"
  73.                                           onclick="password_toggle_confirm();">
  74.                                       <i class="fa-solid fa-eye" id="show_eye_confirm"></i>
  75.                                       <i class="fa-solid fa-eye-slash d-none" id="hide_eye_confirm"></i>
  76.                                     </span>
  77.                                 </div>
  78.                             </div>
  79.                             {{ form_errors(form.user_password.first) }}
  80.                         </div>
  81.                             <p class="small">Votre mot de passe doit contenir minimum huit caractères, un chiffre et une
  82.                                 majuscule.</p>
  83.                             <div class="d-flex justify-content-center">
  84.                                 <button class="custom-btn" type="submit">
  85.                                     <span>Créer compte</span>
  86.                                 </button>
  87.                             </div>
  88.                             {{ form_end(form) }}
  89.                         </div>
  90.                     </section>
  91.                 </div>
  92.             </div>
  93.         </div>
  94.     </div>
  95. {% endblock %}