{% extends 'layout.twig' %}

{% block body %}
  <script type="text/javascript" src="/js/script.js"></script>
  <div class="profil_user">
      <h4>Profil utilisateur {{ nom_user }}</h4>
      <div id="avatar" class="col-sm-10 card" style="text-align:left;margin-left: 1.7rem;">
          <div class="card-block" style="margin-left: 1rem;">
              <h5 class="card-title">Changement d'avatar</h5>
              <!--<div class="col-sm-5" style="float:left;">

              </div>-->
              <div class="col-sm-8" style="float:left;margin-left:0rem;">
                  <div class="form-group">
                      <form method='post' action='' enctype="multipart/form-data">
                          Choisir la nouvelle image : <input type='file' name='file' id='avatar' class='form-control' ><br>
                      </form>
                      <div class="col-sm-8">
                          <div id="avatar_preview" style="max-width:140px;max-height:140px;">
                              <img src="/uploads/avatars/{{ nom_avatar }}" />
                          </div>
                      </div>
                  </div>
              </div>
          </div>
      </div>
      <div id="mot_de_passe" class="col-sm-10 card" style="text-align: left;margin-top:0.8rem; margin-left: 1.7rem;">
          <div class="card-block" style="margin-left: 1rem;margin-top:0.6rem;">
              <h5 class="card-title">Changement de mot de passe</h5>
              <h5 class="card-title">(via l'envoi d'un lien par mail)</h5>
              <div class="container" style="background-color: lightgray;opacity: 0.9;
              margin-left: 0rem;margin-bottom:1rem; padding:1rem;">
                  <form action="/password" method="post">
                      {{ csrf_input() }}
                      {{ field('email', email, 'Votre Email', {type: 'email'}) }}
                      <button class="btn btn-primary">Changer de mot de passe</button>
                  </form>
              </div>
          </div>
      </div>
      <div id="antennes_suivies" class="col-sm-10 card" style="text-align: left;margin-top:0.8rem;margin-left: 1.7rem;">
          <div class="card-block" style="margin-left: 1rem;">
              <h5 class="card-title">Antennes suivies</h5>
              <div>
                  <div class="row" style="margin-left: 2rem;">
                    Paris
                  </div>
              </div>
          </div>
      </div>
      <div id="prochains_gmarches" class="col-sm-10 card" style="text-align: left;margin-top:0.8rem;margin-left: 1.7rem;">
          <div class="card-block" style="margin-left: 1rem;">
              <h5 class="card-title">Prochains Ğ-Marchés</h5>
              <div>

              </div>
          </div>
      </div>
      <div class="col-sm-10 card" style="text-align: left;margin-left: 1.7rem;margin-top:0.8rem;">
          <div class="card-block" style="margin-left: 1rem;">
              <h5 class="card-title">Statistiques diverses</h5>
              <div>
                 <h6 style="margin-left: 1rem;">Biens achetés</h6>
              </div>
              <div>
                 <h6 style="margin-left: 1rem;">Biens vendus</h6>
              </div>
          </div>
      </div>
  </div>
{% endblock %}