PD-4790 fix template

Author: aromanovv

src/app/account-settings/components/settings-security-password/settings-security-password.component.html

@@ -178,101 +178,6 @@
             }
           </div>
         </mat-form-field>
-        <mat-error
-          class="w-full orc-font-small-print mt-2"
-          *ngIf="
-            form.hasError('required', 'retypedPassword') &&
-            form.controls.retypedPassword.touched
-          "
-          i18n="@@register.passwordConfirmationRequired"
-        >
-          <div class="flex">
-            <input
-              formControlName="password"
-              type="password"
-              matInput
-              autocomplete="new-password"
-              [errorStateMatcher]="errorMatcher"
-              id="cy-password-input"
-            />
-            @if (!validate8orMoreCharacters && !validateAtLeastALetterOrSymbol
-            && !validateAtLeastANumber && form.controls.retypedPassword.value
-            === form.controls.password.value){
-            <mat-icon class="check ml-1">check</mat-icon>
-            }
-          </div>
-        </mat-form-field>
-        <mat-error
-          class="w-full orc-font-small-print mt-2"
-          *ngIf="
-            form.hasError('required', 'password') &&
-            form.controls.password.touched
-          "
-          i18n="@@shared.passwordCantBeEmpty"
-        >
-          Password cannot be empty
-        </mat-error>
-        <mat-error
-          class="w-full orc-font-small-print mt-2"
-          *ngIf="
-            !form.hasError('required', 'password') &&
-            (form.hasError('minlength', 'password') ||
-              form.hasError('pattern', 'password')) &&
-            form.controls.password.touched
-          "
-          i18n="@@register.wrongPasswordPatternV2"
-        >
-          Password must meet all requirements
-        </mat-error>
-        <mat-error
-          class="w-full orc-font-small-print mt-2"
-          *ngIf="form.hasError('maxlength', 'password')"
-          i18n="@@register.passwordIsToLongV2"
-        >
-          Password must be between 8 and 256 characters
-        </mat-error>
-        <mat-error
-          class="w-full orc-font-small-print mt-2"
-          *ngIf="this.form.hasError('backendError', 'password')"
-        >
-          <div
-            *ngFor="let error of this.form.getError('backendError', 'password')"
-          >
-            {{ error }}
-          </div>
-        </mat-error>
-      </div>
-      <div class="mb-6">
-        <mat-form-field
-          appearance="outline"
-          class="mat-form-field-min input-container no-hint"
-          [ngClass]="{
-            'valid-password border rounded-xs':
-              !validate8orMoreCharacters &&
-              !validateAtLeastALetterOrSymbol &&
-              !validateAtLeastANumber &&
-              form.controls.retypedPassword.value ===
-                form.controls.password.value
-          }"
-        >
-          <div class="flex">
-            <input
-              formControlName="retypedPassword"
-              type="password"
-              matInput
-              autocomplete="new-password"
-              id="cy-password-confirm-input"
-              class="grow"
-              [errorStateMatcher]="errorMatcher"
-              placeholder="{{ confirmPasswordPlaceholder }}"
-            />
-            @if (!validate8orMoreCharacters && !validateAtLeastALetterOrSymbol
-            && !validateAtLeastANumber && form.controls.retypedPassword.value
-            === form.controls.password.value){
-            <mat-icon class="check ml-1">check</mat-icon>
-            }
-          </div>
-        </mat-form-field>
         <mat-error
           class="w-full orc-font-small-print mt-2"
           *ngIf="
@@ -321,28 +226,6 @@
       </li>
     </ol>
 
-    @if (twoFactorState) {
-    <app-two-factor-auth-form
-      class="w-[537px] block mb-8"
-      codeControlName="twoFactorCode"
-      recoveryControlName="twoFactorRecoveryCode"
-      [showAlert]="true"
-    >
-    </app-two-factor-auth-form>
-    }
-    <div class="button-container">
-      <button
-        (click)="save()"
-        type="submit"
-        mat-raised-button
-        color="primary"
-        i18n="@@shared.saveChanges"
-        id="cy-save-password"
-      >
-        Save changes
-      </button>
-    </div>
-
     @if (twoFactorState) {
     <app-auth-challenge
       class="w-[537px] block mb-8"
@@ -367,11 +250,14 @@
       </button>
     </div>
 
-  <ng-template #valid>
-    <mat-icon class="valid">check_circle</mat-icon>
-  </ng-template>
+    <ng-template #valid>
+      <mat-icon class="checked" class="valid mr-1">check_circle</mat-icon>
+    </ng-template>
 
-  <ng-template #invalid>
-    <mat-icon class="material-icons-outlined">check_circle</mat-icon>
-  </ng-template>
+    <ng-template #invalid>
+      <mat-icon class="no-checked material-icons-outlined mr-1"
+        >radio_button_unchecked
+      </mat-icon>
+    </ng-template>
+  </form>
 </app-settings-panels-data>