templates/content/users/userInterface_page.html.twig line 48

Open in your IDE?
  1. <header class="page-header page-header-compact page-header-light border-bottom bg-white mb-4 positionToHeader">
  2.     <div class="container-fluid px-4">
  3.         <div class="page-header-content">
  4.             <div class="row align-items-center justify-content-between pt-3">
  5.                 <div class="col-auto">
  6.                     <h1 class="text-center text-uppercase "><i class="bi bi-person-circle"></i> Mon Compte</h1>
  7.                     <p class="text-center">Retrouvez votre profil client ici.</p>
  8.                 </div>
  9.                 <div class="col-12 col-xl-auto mb-3">
  10.                     <a class="btn btn-sm btn-primary " href="{{path('app_home')}}">
  11.                         <i class="bi bi-house-fill"></i> &nbsp;
  12.                         Accueil
  13.                     </a>
  14.                 </div>
  15.             </div>
  16.         </div>
  17.     </div>
  18. </header>
  19. <!-- Main page content-->
  20. <div class="container-xl px-4 mt-4">
  21.     <div class="row">
  22.         <div class="col-xl-4">
  23.             <!-- Profile picture card-->
  24.             <div class="card mb-4 mb-xl-0">
  25.                 <div class="card-header">Ma photo (facultatif)
  26.                 </div>
  27.                 <div class="card-body text-center">
  28.                     <!-- Profile picture image-->
  29.                     <img class="img-account-profile rounded-circle mb-2"
  30.                         src="assets/img/illustrations/profiles/profile-1.png" alt="" />
  31.                     <!-- Profile picture help block-->
  32.                     <div class="small font-italic text-muted mb-4">Format fichier JPG ou PNG (max 5 Mo)</div>
  33.                     <!-- Profile picture upload button-->
  34.                     <button class="btn btn-primary" type="button">Téléchargez votre photo
  35.                     </button>
  36.                 </div>
  37.             </div>
  38.         </div>
  39.         <div class="col-xl-8">
  40.             <!-- Account details card-->
  41.             <div class="card mb-4">
  42.                 <div class="card-header">Mon profil</div>
  43.                 <div class="card-body">
  44.                     <form>
  45.                         <div class="mb-3">
  46.                             <label class="small mb-1" for="inputEmailAddress">Login</label>
  47.                             <input class="form-control" id="inputEmailAddress" type="email"
  48.                                 placeholder="Votre adresse E-mail" value="{{app.user.username}}" />
  49.                         </div>
  50.                         <!-- Form Row-->
  51.                         <div class="row gx-3 mb-3">
  52.                             <!-- Form Group (first name)-->
  53.                             <div class="col-md-6">
  54.                                 <label class="small mb-1" for="inputFirstName">Prénom</label>
  55.                                 <input class="form-control" id="inputFirstName" type="text" placeholder="Votre Prénom"
  56.                                     value="{{app.user.firstName}}" />
  57.                             </div>
  58.                             <!-- Form Group (last name)-->
  59.                             <div class="col-md-6">
  60.                                 <label class="small mb-1" for="inputLastName">Nom</label>
  61.                                 <input class="form-control" id="inputLastName" type="text" placeholder=" Votre  Nom"
  62.                                     value="{{app.user.lastName}}" />
  63.                             </div>
  64.                         </div>
  65.                         <div class="mb-3">
  66.                             <label class="small mb-1" for="inputAddress">Adresse</label>
  67.                             <input class="form-control" id="inputAddress" type="email" placeholder=" Votre adresse"
  68.                                 value="{{app.user.address}}" />
  69.                         </div>
  70.                         <!-- Form Row-->
  71.                         <div class="row gx-3 mb-3">
  72.                             <!-- Form Group (first adresse)-->
  73.                             <div class="col-md-6">
  74.                                 <label class="small mb-1" for="inputCityCode">Code Postal</label>
  75.                                 <input class="form-control" id="inputCityCode" type="text"
  76.                                     placeholder="Votre Code Postal " value="{{app.user.cityCode}}" />
  77.                             </div>
  78.                             <!-- Form Group (last name)-->
  79.                             <div class="col-md-6">
  80.                                 <label class="small mb-1" for="inputCity">Ville</label>
  81.                                 <input class="form-control" id="inputCity" type="text" placeholder="Votre ville"
  82.                                     value="{{app.user.city}}" />
  83.                             </div>
  84.                         </div>
  85.                         <div class="mb-3">
  86.                             <label class="small mb-1" for="inputCountry">Pays</label>
  87.                             <input class="form-control" id="inputCountry" type="email" placeholder=" Votre Pays"
  88.                                 value="" />
  89.                         </div>
  90.                         <!-- Form Group (email address)-->
  91.                         <div class="mb-3">
  92.                             <label class="small mb-1" for="inputEmailAddress">adresse E-mail</label>
  93.                             <input class="form-control" id="inputEmailAddress" type="email"
  94.                                 placeholder="Enter your email address" value="{{app.user.email}}" />
  95.                         </div>
  97.                         <!-- Submit button-->
  98.                         <button class="btn btn-primary" type="button">Enregistrer</button>
  99.                     </form>
  100.                 </div>
  101.             </div>
  103.             <div class="card mb-4">
  104.                 <div class="card-header">Modification du mot de passe</div>
  105.                 <div class="card-body">
  106.                     <form>
  107.                         <div class="mb-3">
  108.                             <label class="small mb-1" for="inputEmailAddress">Mail</label>
  109.                             <input class="form-control" id="inputEmailAddress" type="email"
  110.                                 placeholder="Votre adresse E-mail" value="{{app.user.username}}" />
  111.                         </div>
  112.                         <!-- Form Row-->
  113.                         <div class="row gx-3 mb-3">
  114.                             <!-- Form Group (first name)-->
  115.                             <div class="col-md-6">
  116.                                 <label class="small mb-1" for="inputPassword">
  117.                                     Mot de passe
  118.                                 </label>
  119.                                 <input class="form-control" id="inputPassword" type="text"
  120.                                     placeholder="Votre mot de passe" value="" />
  121.                             </div>
  122.                             <!-- Form Group (last name)-->
  123.                             <div class="col-md-6">
  124.                                 <label class="small mb-1" for="inputConfirmPassword">
  125.                                     Confirmez le mot de passe
  126.                                 </label>
  127.                                 <input class="form-control" id="inputonfirmPassword" type="text"
  128.                                     placeholder="Confirmation du mot de passe" value="" />
  129.                             </div>
  130.                         </div>
  133.                         <!-- Submit button-->
  134.                         <button class="btn btn-primary" type="button">Enregistrer</button>
  135.                     </form>
  136.                 </div>
  137.             </div>
  138.         </div>
  139.     </div>
  140. </div>