aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app/signup
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/app/signup')
-rw-r--r--client/src/app/signup/signup.component.html91
-rw-r--r--client/src/app/signup/signup.component.scss8
2 files changed, 56 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>
diff --git a/client/src/app/signup/signup.component.scss b/client/src/app/signup/signup.component.scss
index a98c3c732..90e1e8e74 100644
--- a/client/src/app/signup/signup.component.scss
+++ b/client/src/app/signup/signup.component.scss
@@ -7,6 +7,10 @@ my-instance-features-table {
7 margin-bottom: 40px; 7 margin-bottom: 40px;
8} 8}
9 9
10form {
11 margin: 0 60px 40px 0;
12}
13
10.form-group-terms { 14.form-group-terms {
11 margin: 30px 0; 15 margin: 30px 0;
12} 16}
@@ -15,6 +19,10 @@ my-instance-features-table {
15 @include peertube-input-group(400px); 19 @include peertube-input-group(400px);
16} 20}
17 21
22.input-group-append {
23 height: 30px;
24}
25
18input:not([type=submit]) { 26input:not([type=submit]) {
19 @include peertube-input-text(400px); 27 @include peertube-input-text(400px);
20 display: block; 28 display: block;
generated by cgit v1.2.3 (git 2.25.1) at 2024-11-01 06:25:18 +0000