diff options
Diffstat (limited to 'client/src/app/signup/signup.component.html')
| -rw-r--r-- | client/src/app/signup/signup.component.html | 77 |
1 files changed, 24 insertions, 53 deletions
diff --git a/client/src/app/signup/signup.component.html b/client/src/app/signup/signup.component.html index 07d24b381..ae3a595e9 100644 --- a/client/src/app/signup/signup.component.html +++ b/client/src/app/signup/signup.component.html | |||
| @@ -4,64 +4,35 @@ | |||
| 4 | Create an account | 4 | Create an account |
| 5 | </div> | 5 | </div> |
| 6 | 6 | ||
| 7 | <div *ngIf="info" class="alert alert-info">{{ info }}</div> | ||
| 8 | <div *ngIf="error" class="alert alert-danger">{{ error }}</div> | ||
| 9 | |||
| 10 | <div class="d-flex justify-content-left flex-wrap"> | ||
| 11 | <form role="form" (ngSubmit)="signup()" [formGroup]="form"> | ||
| 12 | <div class="form-group"> | ||
| 13 | <label for="username" i18n>Username</label> | ||
| 14 | |||
| 15 | <div class="input-group"> | ||
| 16 | <input | ||
| 17 | type="text" id="username" i18n-placeholder placeholder="Example: jane_doe" | ||
| 18 | formControlName="username" [ngClass]="{ 'input-error': formErrors['username'] }" | ||
| 19 | > | ||
| 20 | <div class="input-group-append"> | ||
| 21 | <span class="input-group-text">@{{ instanceHost }}</span> | ||
| 22 | </div> | ||
| 23 | </div> | ||
| 24 | |||
| 25 | <div *ngIf="formErrors.username" class="form-error"> | ||
| 26 | {{ formErrors.username }} | ||
| 27 | </div> | ||
| 28 | </div> | ||
| 29 | 7 | ||
| 30 | <div class="form-group"> | 8 | <my-success *ngIf="signupDone"></my-success> |
| 31 | <label for="email" i18n>Email</label> | 9 | <div *ngIf="info" class="alert alert-info">{{ info }}</div> |
| 32 | <input | 10 | <div *ngIf="success" class="alert alert-success">{{ success }}</div> |
| 33 | type="text" id="email" i18n-placeholder placeholder="Email" | ||
| 34 | formControlName="email" [ngClass]="{ 'input-error': formErrors['email'] }" | ||
| 35 | > | ||
| 36 | <div *ngIf="formErrors.email" class="form-error"> | ||
| 37 | {{ formErrors.email }} | ||
| 38 | </div> | ||
| 39 | </div> | ||
| 40 | 11 | ||
| 41 | <div class="form-group"> | 12 | <div class="wrapper" *ngIf="!signupDone"> |
| 42 | <label for="password" i18n>Password</label> | 13 | <div> |
| 43 | <input | 14 | <my-custom-stepper linear *ngIf="!signupDone"> |
| 44 | type="password" id="password" i18n-placeholder placeholder="Password" | 15 | <cdk-step [stepControl]="formStepUser" i18n-label label="User information"> |
| 45 | formControlName="password" [ngClass]="{ 'input-error': formErrors['password'] }" | 16 | <my-signup-step-user (formBuilt)="onUserFormBuilt($event)"></my-signup-step-user> |
| 46 | > | ||
| 47 | <div *ngIf="formErrors.password" class="form-error"> | ||
| 48 | {{ formErrors.password }} | ||
| 49 | </div> | ||
| 50 | </div> | ||
| 51 | 17 | ||
| 52 | <div class="form-group form-group-terms"> | 18 | <button i18n cdkStepperNext [disabled]="!formStepUser || !formStepUser.valid">Next</button> |
| 53 | <my-peertube-checkbox | 19 | </cdk-step> |
| 54 | inputName="terms" formControlName="terms" | ||
| 55 | i18n-labelHtml labelHtml="I am at least 16 years old 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 | 20 | ||
| 58 | <div *ngIf="formErrors.terms" class="form-error"> | 21 | <cdk-step [stepControl]="formStepChannel" i18n-label label="Channel information"> |
| 59 | {{ formErrors.terms }} | 22 | <my-signup-step-channel (formBuilt)="onChannelFormBuilt($event)" [username]="getUsername()"></my-signup-step-channel> |
| 60 | </div> | ||
| 61 | </div> | ||
| 62 | 23 | ||
| 63 | <input type="submit" i18n-value value="Signup" [disabled]="!form.valid || signupDone"> | 24 | <button i18n cdkStepperNext (click)="signup()" |
| 64 | </form> | 25 | [disabled]="!formStepChannel || !formStepChannel.valid || hasSameChannelAndAccountNames()" |
| 26 | > | ||
| 27 | Create my account | ||
| 28 | </button> | ||
| 29 | </cdk-step> | ||
| 30 | |||
| 31 | <cdk-step i18n-label label="Done" editable="false"> | ||
| 32 | <div *ngIf="error" class="alert alert-danger">{{ error }}</div> | ||
| 33 | </cdk-step> | ||
| 34 | </my-custom-stepper> | ||
| 35 | </div> | ||
| 65 | 36 | ||
| 66 | <div> | 37 | <div> |
| 67 | <label i18n>Features found on this instance</label> | 38 | <label i18n>Features found on this instance</label> |