diff options
author | Rigel Kent <sendmemail@rigelk.eu> | 2020-12-04 15:58:55 +0100 |
---|---|---|
committer | Rigel Kent <sendmemail@rigelk.eu> | 2020-12-04 16:01:53 +0100 |
commit | f8b530e0a523a0d9ff469ef716838374c395a360 (patch) | |
tree | a55d49365e539582dd5000a2c73b9351df93a52d /client/src/app/+my-account/my-account-settings/my-account-change-password | |
parent | aa5ee5017a83b280352f8dbcfed2d4741709a4fd (diff) | |
download | PeerTube-f8b530e0a523a0d9ff469ef716838374c395a360.tar.gz PeerTube-f8b530e0a523a0d9ff469ef716838374c395a360.tar.zst PeerTube-f8b530e0a523a0d9ff469ef716838374c395a360.zip |
unify inputs requiring buttons like password inputs
Diffstat (limited to 'client/src/app/+my-account/my-account-settings/my-account-change-password')
3 files changed, 23 insertions, 21 deletions
diff --git a/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.html b/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.html index 4756cfecd..f1127b6a1 100644 --- a/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.html +++ b/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.html | |||
@@ -3,26 +3,29 @@ | |||
3 | <form role="form" (ngSubmit)="changePassword()" [formGroup]="form"> | 3 | <form role="form" (ngSubmit)="changePassword()" [formGroup]="form"> |
4 | 4 | ||
5 | <label i18n for="current-password">Change password</label> | 5 | <label i18n for="current-password">Change password</label> |
6 | <input | 6 | <my-input-toggle-hidden formControlName="current-password" |
7 | type="password" id="current-password" i18n-placeholder placeholder="Current password" autocomplete="current-password" | 7 | id="current-password" |
8 | formControlName="current-password" [ngClass]="{ 'input-error': formErrors['current-password'] }" class="form-control" | 8 | i18n-placeholder placeholder="Current password" |
9 | > | 9 | [ngClass]="{ 'input-error': formErrors['current-password'] }" |
10 | autocomplete="current-password"></my-input-toggle-hidden> | ||
10 | <div *ngIf="formErrors['current-password']" class="form-error"> | 11 | <div *ngIf="formErrors['current-password']" class="form-error"> |
11 | {{ formErrors['current-password'] }} | 12 | {{ formErrors['current-password'] }} |
12 | </div> | 13 | </div> |
13 | 14 | ||
14 | <input | 15 | <my-input-toggle-hidden formControlName="new-password" |
15 | type="password" id="new-password" i18n-placeholder placeholder="New password" autocomplete="new-password" | 16 | id="new-password" |
16 | formControlName="new-password" [ngClass]="{ 'input-error': formErrors['new-password'] }" class="form-control" | 17 | i18n-placeholder placeholder="New password" |
17 | > | 18 | [ngClass]="{ 'input-error': formErrors['new-password'] }" |
19 | autocomplete="new-password"></my-input-toggle-hidden> | ||
18 | <div *ngIf="formErrors['new-password']" class="form-error"> | 20 | <div *ngIf="formErrors['new-password']" class="form-error"> |
19 | {{ formErrors['new-password'] }} | 21 | {{ formErrors['new-password'] }} |
20 | </div> | 22 | </div> |
21 | 23 | ||
22 | <input | 24 | <my-input-toggle-hidden formControlName="new-confirmed-password" |
23 | type="password" id="new-confirmed-password" i18n-placeholder placeholder="Confirm new password" autocomplete="new-password" | 25 | id="new-confirmed-password" |
24 | formControlName="new-confirmed-password" class="form-control" | 26 | i18n-placeholder placeholder="Confirm new password" |
25 | > | 27 | [ngClass]="{ 'input-error': formErrors['new-confirmed-password'] }" |
28 | autocomplete="new-password"></my-input-toggle-hidden> | ||
26 | <div *ngIf="formErrors['new-confirmed-password']" class="form-error"> | 29 | <div *ngIf="formErrors['new-confirmed-password']" class="form-error"> |
27 | {{ formErrors['new-confirmed-password'] }} | 30 | {{ formErrors['new-confirmed-password'] }} |
28 | </div> | 31 | </div> |
diff --git a/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.scss b/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.scss index 381afae07..0d1f3094a 100644 --- a/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.scss +++ b/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.scss | |||
@@ -6,14 +6,14 @@ label { | |||
6 | font-size: 100%; | 6 | font-size: 100%; |
7 | } | 7 | } |
8 | 8 | ||
9 | input[type=password] { | 9 | my-input-toggle-hidden { |
10 | @include peertube-input-text(340px); | 10 | width: 340px; |
11 | display: block; | 11 | display: block; |
12 | } | ||
12 | 13 | ||
13 | &#new-password, | 14 | #new-password, |
14 | &#new-confirmed-password { | 15 | #new-confirmed-password { |
15 | margin-top: 15px; | 16 | margin-top: 15px; |
16 | } | ||
17 | } | 17 | } |
18 | 18 | ||
19 | input[type=submit] { | 19 | input[type=submit] { |
@@ -22,4 +22,3 @@ input[type=submit] { | |||
22 | 22 | ||
23 | margin-top: 15px; | 23 | margin-top: 15px; |
24 | } | 24 | } |
25 | |||
diff --git a/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.ts b/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.ts index ba68bab32..e034aedef 100644 --- a/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.ts +++ b/client/src/app/+my-account/my-account-settings/my-account-change-password/my-account-change-password.component.ts | |||
@@ -1,7 +1,7 @@ | |||
1 | import { filter } from 'rxjs/operators' | 1 | import { filter } from 'rxjs/operators' |
2 | import { Component, OnInit } from '@angular/core' | 2 | import { Component, OnInit } from '@angular/core' |
3 | import { AuthService, Notifier, UserService } from '@app/core' | 3 | import { AuthService, Notifier, UserService } from '@app/core' |
4 | import { USER_CONFIRM_PASSWORD_VALIDATOR, USER_PASSWORD_VALIDATOR } from '@app/shared/form-validators/user-validators' | 4 | import { USER_CONFIRM_PASSWORD_VALIDATOR, USER_PASSWORD_VALIDATOR, USER_EXISTING_PASSWORD_VALIDATOR } from '@app/shared/form-validators/user-validators' |
5 | import { FormReactive, FormValidatorService } from '@app/shared/shared-forms' | 5 | import { FormReactive, FormValidatorService } from '@app/shared/shared-forms' |
6 | import { User } from '@shared/models' | 6 | import { User } from '@shared/models' |
7 | 7 | ||
@@ -25,7 +25,7 @@ export class MyAccountChangePasswordComponent extends FormReactive implements On | |||
25 | 25 | ||
26 | ngOnInit () { | 26 | ngOnInit () { |
27 | this.buildForm({ | 27 | this.buildForm({ |
28 | 'current-password': USER_PASSWORD_VALIDATOR, | 28 | 'current-password': USER_EXISTING_PASSWORD_VALIDATOR, |
29 | 'new-password': USER_PASSWORD_VALIDATOR, | 29 | 'new-password': USER_PASSWORD_VALIDATOR, |
30 | 'new-confirmed-password': USER_CONFIRM_PASSWORD_VALIDATOR | 30 | 'new-confirmed-password': USER_CONFIRM_PASSWORD_VALIDATOR |
31 | }) | 31 | }) |