fuzi_fauzia/hemat_solution
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update icon update password

Browse Source
This commit is contained in:
Fuzi_fauzia
2024-07-09 16:20:28 +07:00
parent f86f727ac7
commit 1ed4ad5da0
3 changed files with 59 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

116
src/app/content/hemat-app/user-profile/update-password/update-password.component.html
View File

@@ -48,89 +48,81 @@
></i>
</button>
</div> -->
<div class="form-group position-relative">
<label for="newPass" style="color: #ffffff"
>New Password</label
>
<input
[type]="showNewPass ? 'text' : 'password'"
id="newPass"
class="form-control"
formControlName="newPass"
maxlength="20"
placeholder="********"
[ngClass]="{
'is-invalid': submitted && f.newPass.errors
}"
/>
<div class="form-group">
<label for="newPass" style="color: #ffffff">New Password</label>
<div class="input-group">
<input
[type]="showNewPass ? 'text' : 'password'"
id="newPass"
class="form-control"
formControlName="newPass"
maxlength="20"
placeholder="********"
[ngClass]="{
'is-invalid': submitted && f.newPass.errors
}"
/>
<div class="input-group-append">
<button
type="button"
class="btn btn-link"
(click)="toggleNewPassVisibility()"
style="color: #c3f164 !important;"
>
<i [class]="showNewPass ? 'fa fa-eye-slash' : 'fa fa-eye'"></i>
</button>
</div>
</div>
<small
class="form-text text-muted danger"
*ngIf="submitted && f.newPass.errors"
class="invalid-feedback"
>
<div *ngIf="f.newPass.errors.required">
New Password is required
</div>
<div *ngIf="f.newPass.errors.required">New Password is required</div>
<div *ngIf="f.newPass.errors.minlength">
New Password must be at least 8 characters long
</div>
<div *ngIf="f.newPass.errors.pattern">
New Password must contain at least one uppercase
letter, one lowercase letter, and one number
New Password must contain at least one uppercase letter, one lowercase letter, and one number
</div>
</small>
<button
type="button"
class="btn btn-link position-absolute"
(click)="toggleNewPassVisibility()"
style="top: 30px; right: 10px; color: #c3f164 !important;"
>
<i
[class]="
showNewPass ? 'fa fa-eye-slash' : 'fa fa-eye'
"
></i>
</button>
</div>
<div class="form-group position-relative">
<label for="confirmPass" style="color: #ffffff"
>Confirm Password</label
>
<input
[type]="showConfirmPass ? 'text' : 'password'"
id="confirmPass"
class="form-control"
formControlName="confirmPass"
maxlength="20"
placeholder="********"
[ngClass]="{
'is-invalid': submitted && f.confirmPass.errors
}"
/>
<div class="form-group">
<label for="confirmPass" style="color: #ffffff">Confirm Password</label>
<div class="input-group">
<input
[type]="showConfirmPass ? 'text' : 'password'"
id="confirmPass"
class="form-control"
formControlName="confirmPass"
maxlength="20"
placeholder="********"
[ngClass]="{
'is-invalid': submitted && f.confirmPass.errors
}"
/>
<div class="input-group-append">
<button
type="button"
class="btn btn-link"
(click)="toggleConfirmPassVisibility()"
style="color: #c3f164 !important;"
>
<i [class]="showConfirmPass ? 'fa fa-eye-slash' : 'fa fa-eye'"></i>
</button>
</div>
</div>
<small
class="form-text text-muted danger"
*ngIf="submitted && f.confirmPass.errors"
class="invalid-feedback"
>
<div *ngIf="f.confirmPass.errors.required">
Confirm Password is required
</div>
<div *ngIf="f.confirmPass.errors.required">Confirm Password is required</div>
<div *ngIf="f.confirmPass.errors.matchPassword">
Confirm Password must match the New Password
</div>
</small>
<button
type="button"
class="btn btn-link position-absolute"
(click)="toggleConfirmPassVisibility()"
style="top: 30px; right: 10px; color: #c3f164 !important;"
>
<i
[class]="
showConfirmPass ? 'fa fa-eye-slash' : 'fa fa-eye'
"
></i>
</button>
</div>
</div>
</div>