<app-header></app-header>
<div class="signin-form text-center">
  <main class="form-forgot">
    <form (ngSubmit)="onSubmit(forgotForm)" #forgotForm="ngForm">
      <div class="form-floating">
        <input type="email" class="form-control" id="floatingInput" placeholder="" name="email" ngModel required
          [ngClass]="{'is-valid': forgotForm.form.touched && forgotForm.form.value['email'] != '' ,
                                    'is-invalid': forgotForm.form.touched && forgotForm.form.value['email'] == ''}">
        <label for="floatingInput">Adresse email</label>
      </div>

      <!-- <button class="w-100 btn btn-lg btn-success"  type="submit" [disabled]="forgotForm.invalid" routerLink="../reinitialisation-password"
        routerLinkActive="active-custom">Ré-initialiser mon mot de passe</button> -->

        <button 
        class="w-100 btn btn-lg btn-outline-success"
        type="submit"
        [disabled]="forgotForm.invalid">
        Ré-initialiser mon mot de passe
        <div class="text-center" *ngIf="isLoading">
          <div class="spinner-border" role="status">
            <span class="sr-only">Loading...</span>
          </div>
        </div>
      </button>
    </form>
    <br/> <br/>
    <div *ngIf="isShow">
      <div class="alert alert-{{alert.type}}" role="alert">
        {{alert.content}}
      </div>
    </div>
  </main>
</div>

