fix: refine auth feedback live announcements

This commit is contained in:
Denis Skripnik 2026-05-31 09:17:34 +00:00
parent 2414e69c84
commit b024ed5bfc
4 changed files with 9 additions and 9 deletions

View file

@ -29,8 +29,8 @@
</div>
</mat-sidenav-content>
</mat-sidenav-container>
<div *ngIf="!selNode.settings.themeColor" class="rtl-spinner" role="status" aria-live="polite" aria-atomic="true">
<mat-spinner color="accent" aria-label="Loading RTL" />
<div *ngIf="!selNode.settings.themeColor" class="rtl-spinner" role="status">
<mat-spinner color="accent" aria-hidden="true" />
<h4>Loading RTL...</h4>
</div>
</div>

View file

@ -11,7 +11,7 @@
<mat-form-field>
<mat-label>Password</mat-label>
<input autoFocus matInput type="password" id="password" name="password" tabindex="1" required [(ngModel)]="password">
<mat-error *ngIf="!password" role="alert" aria-live="assertive">Password is required.</mat-error>
<mat-error *ngIf="!password" aria-live="polite">Password is required.</mat-error>
</mat-form-field>
<div fxLayout="row" fxFlex="100" fxLayoutAlign="end center" class="mt-1">
<button mat-button color="primary" tabindex="2" type="submit" default (click)="onAuthenticate()">Confirm</button>

View file

@ -19,13 +19,13 @@
<button mat-icon-button matSuffix tabindex="2" type="button" [attr.aria-label]="'Hide password'" (click)="flgShow = !flgShow">
<mat-icon>{{flgShow ? 'visibility_off' : 'visibility'}}</mat-icon>
</button>
<mat-error *ngIf="!password" role="alert" aria-live="assertive">Password is required.</mat-error>
<mat-error *ngIf="!password" aria-live="polite">Password is required.</mat-error>
</mat-form-field>
<p *ngIf="loginErrorMessage !== ''" class="color-warn pre-wrap" fxFlex="100" fxLayoutAlign="start center" role="alert" aria-live="assertive" aria-atomic="true">
<p *ngIf="loginErrorMessage !== ''" class="color-warn pre-wrap" fxFlex="100" fxLayoutAlign="start center" role="alert">
<mat-icon class="mr-3px icon-small" fxLayoutAlign="center center">close</mat-icon>
{{loginErrorMessage}}
</p>
<p *ngIf="logoutReason !== ''" class="color-warn pre-wrap" fxLayout="row" fxFlex="100" fxLayoutAlign="start center" role="status" aria-live="polite" aria-atomic="true">
<p *ngIf="logoutReason !== ''" class="color-warn pre-wrap" fxLayout="row" fxFlex="100" fxLayoutAlign="start center" role="status">
<mat-icon class="mr-3px icon-small" fxLayoutAlign="center center">close</mat-icon>
{{logoutReason}}
</p>

View file

@ -7,17 +7,17 @@
<mat-form-field>
<mat-label>Current Password</mat-label>
<input autoFocus matInput type="password" id="currpassword" name="currpassword" tabindex="1" required [(ngModel)]="currPassword">
<mat-error *ngIf="!currPassword" role="alert" aria-live="assertive">Current password is required.</mat-error>
<mat-error *ngIf="!currPassword" aria-live="polite">Current password is required.</mat-error>
</mat-form-field>
<mat-form-field>
<mat-label>New Password</mat-label>
<input matInput type="password" id="newpassword" name="newpassword" tabindex="2" required [(ngModel)]="newPassword">
<mat-error *ngIf="matchOldAndNewPasswords()" role="alert" aria-live="assertive">{{errorMsg}}</mat-error>
<mat-error *ngIf="matchOldAndNewPasswords()" aria-live="polite">{{errorMsg}}</mat-error>
</mat-form-field>
<mat-form-field>
<mat-label>Confirm New Password</mat-label>
<input matInput type="password" id="confirmpassword" name="confirmpassword" tabindex="3" required [(ngModel)]="confirmPassword">
<mat-error *ngIf="matchNewPasswords()" role="alert" aria-live="assertive">{{errorConfirmMsg}}</mat-error>
<mat-error *ngIf="matchNewPasswords()" aria-live="polite">{{errorConfirmMsg}}</mat-error>
</mat-form-field>
<div fxLayout="row" fxLayoutAlign="start start" class="mt-1">
<button class="mr-1" mat-stroked-button color="primary" type="reset" tabindex="4" (click)="onResetPassword()">Reset</button>