diff options
| author | Rigel Kent <sendmemail@rigelk.eu> | 2018-08-28 22:58:13 +0200 |
|---|---|---|
| committer | Rigel Kent <par@rigelk.eu> | 2018-08-29 13:58:35 +0200 |
| commit | 07872fdf744282f26e9d38eff6b194a991a9d90a (patch) | |
| tree | 440b5fc1a41140ac5593291a668bb6b12c5a2e6e /client/src/app/signup/signup.component.html | |
| parent | 8b60488020883c66d3831eacd030893ab184268f (diff) | |
| download | PeerTube-07872fdf744282f26e9d38eff6b194a991a9d90a.tar.gz PeerTube-07872fdf744282f26e9d38eff6b194a991a9d90a.tar.zst PeerTube-07872fdf744282f26e9d38eff6b194a991a9d90a.zip | |
replacing placeholder and feature table display improvement
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> |