Update change-password.component.html

mazdak/UX-fix-changePassword
Mazdak Gibran 3 weeks ago
parent cbe3b93043
commit aa3b22c65f

@ -96,8 +96,8 @@
{{ 'oldPassword' | translate }}<span {{ 'oldPassword' | translate }}<span
class="mandatory">*</span> class="mandatory">*</span>
</label> </label>
<div class="password-wrapper position-relative w-100"> <div class="w-100">
<div class="d-flex flex-row align-items-stretch"> <div class="password-wrapper">
<input type="text" id="oldPassword" <input type="text" id="oldPassword"
class="form-control" class="form-control"
formControlName="oldPassword" formControlName="oldPassword"
@ -106,6 +106,7 @@
/> />
<app-password-hide-show #psh class="password-eye align-items-stretch" [showPassword]="true" (onEyeClick)="togglePasswordType()"></app-password-hide-show> <app-password-hide-show #psh class="password-eye align-items-stretch" [showPassword]="true" (onEyeClick)="togglePasswordType()"></app-password-hide-show>
</div> </div>
<div class="text-danger" *ngIf="changePasswordForm.get('oldPassword')?.touched && <div class="text-danger" *ngIf="changePasswordForm.get('oldPassword')?.touched &&
changePasswordForm.get('oldPassword')?.invalid"> changePasswordForm.get('oldPassword')?.invalid">
{{ 'fieldRequired' | translate }} {{ 'fieldRequired' | translate }}
@ -120,24 +121,21 @@
{{ 'enterNewPassword' | translate }}<span {{ 'enterNewPassword' | translate }}<span
class="mandatory">*</span> class="mandatory">*</span>
</label> </label>
<div class="password-wrapper position-relative w-100"> <div class="w-100">
<div class="password-wrapper">
<input id="newPassword" <input id="newPassword" class="form-control" formControlName="newPassword" type="{{passwordType1}}" maxlength="500"
class="form-control" placeholder="{{ 'enterNewPassword' | translate }}" appNoWhitespaces rows="3" />
formControlName="newPassword" <app-password-hide-show #psh1 class="password-eye align-items-stretch" [showPassword]="true"
type="{{passwordType1}}" (onEyeClick)="togglePasswordType1()"></app-password-hide-show>
maxlength="500" </div>
placeholder="{{ 'enterNewPassword' | translate }}" appNoWhitespaces
rows="3" />
<app-password-hide-show #psh1 class="password-eye align-items-stretch" [showPassword]="true" (onEyeClick)="togglePasswordType1()"></app-password-hide-show>
</div>
<div class="text-danger" *ngIf="newPasswordError$"> <div class="text-danger" *ngIf="newPasswordError$">
{{ newPasswordError$ | translate }} {{ newPasswordError$ | translate }}
</div> </div>
</div> </div>
</div> </div>
</div>
</div> </div>
<div class="row g-3 mb-3"> <div class="row g-3 mb-3">
@ -147,23 +145,20 @@
{{ 'confirmPassword' | translate }}<span {{ 'confirmPassword' | translate }}<span
class="mandatory">*</span> class="mandatory">*</span>
</label> </label>
<div class="password-wrapper position-relative w-100"> <div class="w-100">
<div class="password-wrapper">
<input id="confirmPassword" <input id="confirmPassword" class="form-control" formControlName="confirmPassword" type="{{passwordType2}}"
class="form-control" maxlength="500" placeholder="{{ 'confirmPassword' | translate }}" appNoWhitespaces rows="3" />
formControlName="confirmPassword" <app-password-hide-show #psh2 class="password-eye align-items-stretch" [showPassword]="true"
type="{{passwordType2}}" (onEyeClick)="togglePasswordType2()"></app-password-hide-show>
maxlength="500"
placeholder="{{ 'confirmPassword' | translate }}" appNoWhitespaces
rows="3" />
<app-password-hide-show #psh2 class="password-eye align-items-stretch" [showPassword]="true" (onEyeClick)="togglePasswordType2()"></app-password-hide-show>
</div> </div>
<div class="text-danger" *ngIf="confirmPasswordError$"> <div class="text-danger" *ngIf="confirmPasswordError$">
{{ confirmPasswordError$ | translate }} {{ confirmPasswordError$ | translate }}
</div> </div>
</div> </div>
</div>
</div> </div>
<div class="col-md-6"> <div class="col-md-6">

Loading…
Cancel
Save