| 1 | <h1 id="title" class="title">Forgot Password</h1>
|
| 2 | <p class="sub-title">Enter your email address and we’ll send a link to reset your password</p>
|
| 3 |
|
| 4 | <nb-alert *ngIf="showMessages.error && errors?.length && !submitted" outline="danger" role="alert">
|
| 5 | <p class="alert-title"><b>Oh snap!</b></p>
|
| 6 | <ul class="alert-message-list">
|
| 7 | <li *ngFor="let error of errors" class="alert-message">{{ error }}</li>
|
| 8 | </ul>
|
| 9 | </nb-alert>
|
| 10 |
|
| 11 | <nb-alert *ngIf="showMessages.success && messages?.length && !submitted" outline="success" role="alert">
|
| 12 | <p class="alert-title"><b>Hooray!</b></p>
|
| 13 | <ul class="alert-message-list">
|
| 14 | <li *ngFor="let message of messages" class="alert-message">{{ message }}</li>
|
| 15 | </ul>
|
| 16 | </nb-alert>
|
| 17 |
|
| 18 | <form (ngSubmit)="requestPass()" #requestPassForm="ngForm" aria-labelledby="title">
|
| 19 |
|
| 20 | <div class="form-control-group">
|
| 21 | <label class="label" for="input-email">Enter your email address:</label>
|
| 22 | <input nbInput
|
| 23 | [(ngModel)]="user.email"
|
| 24 | #email="ngModel"
|
| 25 | id="input-email"
|
| 26 | name="email"
|
| 27 | pattern=".+@.+\..+"
|
| 28 | placeholder="Email address"
|
| 29 | autofocus
|
| 30 | fullWidth
|
| 31 | fieldSize="large"
|
| 32 | [status]="email.dirty ? (email.invalid ? 'danger' : 'success') : 'basic'"
|
| 33 | [required]="getConfigValue('forms.validation.email.required')"
|
| 34 | [attr.aria-invalid]="email.invalid && email.touched ? true : null">
|
| 35 | <ng-container *ngIf="email.invalid && email.touched">
|
| 36 | <p class="caption status-danger" *ngIf="email.errors?.required">
|
| 37 | Email is required!
|
| 38 | </p>
|
| 39 | <p class="caption status-danger" *ngIf="email.errors?.pattern">
|
| 40 | Email should be the real one!
|
| 41 | </p>
|
| 42 | </ng-container>
|
| 43 | </div>
|
| 44 |
|
| 45 | <button nbButton
|
| 46 | fullWidth
|
| 47 | status="primary"
|
| 48 | size="large"
|
| 49 | [disabled]="submitted || !requestPassForm.valid"
|
| 50 | [class.btn-pulse]="submitted">
|
| 51 | Request password
|
| 52 | </button>
|
| 53 | </form>
|
| 54 |
|
| 55 | <section class="sign-in-or-up" aria-label="Sign in or sign up">
|
| 56 | <p><a class="text-link" routerLink="../login">Back to Log In</a></p>
|
| 57 | <p><a routerLink="../register" class="text-link">Register</a></p>
|
| 58 | </section>
|