signup.component.html
2.68 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<div class="session mat-indigo">
<div class="session-content">
<div class="session-wrapper">
<mat-card>
<mat-card-content>
<form [formGroup]="form" (ngSubmit)="onSubmit()">
<div class="text-xs-center pb-1">
<img src="assets/images/logo-dark.svg" alt=""/>
<p class="mat-text-muted">Create an app id to continue.</p>
</div>
<div fxLayout="column" fxLayoutAlign="space-around">
<div class="pb-1">
<mat-form-field style="width: 100%">
<input matInput placeholder="Email address" type="email" [formControl]="form.controls['email']">
</mat-form-field>
<small *ngIf="form.controls['email'].hasError('required') && form.controls['email'].touched" class="mat-text-warn">You must include an email address.</small>
<small *ngIf="form.controls['email'].errors?.email && form.controls['email'].touched" class="mat-text-warn">You must include a valid email address.</small>
</div>
<div class="pb-1">
<mat-form-field style="width: 100%">
<input matInput type="password" placeholder="Password" [formControl]="form.controls['password']">
</mat-form-field>
<small *ngIf="form.controls['password'].hasError('required') && form.controls['password'].touched" class="mat-text-warn">You must include password.</small>
</div>
<div class="pb-1">
<mat-form-field style="width: 100%">
<input matInput placeholder="Confirm Password" [formControl]="form.controls['confirmPassword']" type="password">
</mat-form-field>
<small *ngIf="form.controls['confirmPassword'].hasError('required') && form.controls['confirmPassword'].touched" class="mat-text-warn">You must include confirm password.</small>
<small *ngIf="form.controls['confirmPassword'].errors?.equalTo" class="mat-text-warn">Passwords do not math.</small>
</div>
<div class="pb-1">
<mat-checkbox>I have read and agree to the terms of service.</mat-checkbox>
</div>
<button mat-raised-button color="primary" class="btn-block" type="submit" [disabled]="!form.valid">Create your account</button>
</div>
<div class="pt-1 pb-1 text-xs-center">
<a [routerLink]="['/session/forgot']">Forgot password?</a>
<a [routerLink]="['/session/signin']">Access your account.</a>
</div>
</form>
</mat-card-content>
</mat-card>
</div>
</div>
</div>