diff options
Diffstat (limited to 'client/src/app/signup/signup.component.html')
-rw-r--r-- | client/src/app/signup/signup.component.html | 91 |
1 files changed, 48 insertions, 43 deletions
diff --git a/client/src/app/signup/signup.component.html b/client/src/app/signup/signup.component.html index f7b8f587b..aad4b5be3 100644 --- a/client/src/app/signup/signup.component.html +++ b/client/src/app/signup/signup.component.html | |||
@@ -4,63 +4,68 @@ | |||
4 | Create an account | 4 | Create an account |
5 | </div> | 5 | </div> |
6 | 6 | ||
7 | <my-instance-features-table></my-instance-features-table> | ||
8 | |||
9 | <div *ngIf="error" class="alert alert-danger">{{ error }}</div> | 7 | <div *ngIf="error" class="alert alert-danger">{{ error }}</div> |
10 | 8 | ||
11 | <form role="form" (ngSubmit)="signup()" [formGroup]="form"> | 9 | <div class="d-flex justify-content-left flex-wrap"> |
12 | <div class="form-group"> | 10 | <form role="form" (ngSubmit)="signup()" [formGroup]="form"> |
13 | <label for="username" i18n>Username</label> | 11 | <div class="form-group"> |
12 | <label for="username" i18n>Username</label> | ||
13 | |||
14 | <div class="input-group"> | ||
15 | <input | ||
16 | type="text" id="username" i18n-placeholder placeholder="Example: jane_doe" | ||
17 | formControlName="username" [ngClass]="{ 'input-error': formErrors['username'] }" | ||
18 | > | ||
19 | <div class="input-group-append"> | ||
20 | <span class="input-group-text">@{{ instanceHost }}</span> | ||
21 | </div> | ||
22 | </div> | ||
14 | 23 | ||
15 | <div class="input-group"> | 24 | <div *ngIf="formErrors.username" class="form-error"> |
25 | {{ formErrors.username }} | ||
26 | </div> | ||
27 | </div> | ||
28 | |||
29 | <div class="form-group"> | ||
30 | <label for="email" i18n>Email</label> | ||
16 | <input | 31 | <input |
17 | type="text" id="username" i18n-placeholder placeholder="Example: neil_amstrong" | 32 | type="text" id="email" i18n-placeholder placeholder="Email" |
18 | formControlName="username" [ngClass]="{ 'input-error': formErrors['username'] }" | 33 | formControlName="email" [ngClass]="{ 'input-error': formErrors['email'] }" |
19 | > | 34 | > |
20 | <div class="input-group-append"> | 35 | <div *ngIf="formErrors.email" class="form-error"> |
21 | <span class="input-group-text">@{{ instanceHost }}</span> | 36 | {{ formErrors.email }} |
22 | </div> | 37 | </div> |
23 | </div> | 38 | </div> |
24 | 39 | ||
25 | <div *ngIf="formErrors.username" class="form-error"> | 40 | <div class="form-group"> |
26 | {{ formErrors.username }} | 41 | <label for="password" i18n>Password</label> |
42 | <input | ||
43 | type="password" id="password" i18n-placeholder placeholder="Password" | ||
44 | formControlName="password" [ngClass]="{ 'input-error': formErrors['password'] }" | ||
45 | > | ||
46 | <div *ngIf="formErrors.password" class="form-error"> | ||
47 | {{ formErrors.password }} | ||
48 | </div> | ||
27 | </div> | 49 | </div> |
28 | </div> | ||
29 | 50 | ||
30 | <div class="form-group"> | 51 | <div class="form-group form-group-terms"> |
31 | <label for="email" i18n>Email</label> | 52 | <my-peertube-checkbox |
32 | <input | 53 | inputName="terms" formControlName="terms" |
33 | type="text" id="email" i18n-placeholder placeholder="Email" | 54 | i18n-labelHtml labelHtml="I have read and agree to the <a href='/about/instance#terms-section' target='_blank'rel='noopener noreferrer'>Terms</a> of this instance" |
34 | formControlName="email" [ngClass]="{ 'input-error': formErrors['email'] }" | 55 | ></my-peertube-checkbox> |
35 | > | ||
36 | <div *ngIf="formErrors.email" class="form-error"> | ||
37 | {{ formErrors.email }} | ||
38 | </div> | ||
39 | </div> | ||
40 | 56 | ||
41 | <div class="form-group"> | 57 | <div *ngIf="formErrors.terms" class="form-error"> |
42 | <label for="password" i18n>Password</label> | 58 | {{ formErrors.terms }} |
43 | <input | 59 | </div> |
44 | type="password" id="password" i18n-placeholder placeholder="Password" | ||
45 | formControlName="password" [ngClass]="{ 'input-error': formErrors['password'] }" | ||
46 | > | ||
47 | <div *ngIf="formErrors.password" class="form-error"> | ||
48 | {{ formErrors.password }} | ||
49 | </div> | 60 | </div> |
50 | </div> | ||
51 | 61 | ||
52 | <div class="form-group form-group-terms"> | 62 | <input type="submit" i18n-value value="Signup" [disabled]="!form.valid"> |
53 | <my-peertube-checkbox | 63 | </form> |
54 | inputName="terms" formControlName="terms" | ||
55 | i18n-labelHtml labelHtml="I have read and agree to the <a href='/about/instance#terms-section' target='_blank'rel='noopener noreferrer'>Terms</a> of this instance" | ||
56 | ></my-peertube-checkbox> | ||
57 | 64 | ||
58 | <div *ngIf="formErrors.terms" class="form-error"> | 65 | <div> |
59 | {{ formErrors.terms }} | 66 | <label for="email" i18n>Features found on this instance</label> |
60 | </div> | 67 | <my-instance-features-table></my-instance-features-table> |
61 | </div> | 68 | </div> |
62 | 69 | </div> | |
63 | <input type="submit" i18n-value value="Signup" [disabled]="!form.valid"> | ||
64 | </form> | ||
65 | 70 | ||
66 | </div> | 71 | </div> |