mirror of
https://github.com/bitwarden/desktop.git
synced 2024-11-12 10:04:44 +01:00
aria hide page content when modal shown
This commit is contained in:
parent
adff98e55a
commit
1c5233c7dd
@ -1,4 +1,4 @@
|
||||
<form id="login-page" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
|
||||
<form id="login-page" #form (ngSubmit)="submit()" [appApiAction]="formPromise" attr.aria-hidden="{{showingModal}}">
|
||||
<div class="content">
|
||||
<img class="logo-image" alt="Bitwarden">
|
||||
<p class="lead">{{'loginOrCreateNewAccount' | i18n}}</p>
|
||||
@ -36,8 +36,9 @@
|
||||
<div class="sub-options">
|
||||
<a routerLink="/hint">{{'getMasterPasswordHint' | i18n}}</a>
|
||||
</div>
|
||||
<a href="#" appStopClick (click)="settings()" class="settings-icon">
|
||||
<i class="fa fa-cog fa-lg" aria-hidden="true"></i><span> {{'settings' | i18n}}</span>
|
||||
<a href="#" appStopClick (click)="settings()" class="settings-icon" attr.aria-label="{{'settings' | i18n}}">
|
||||
<i class="fa fa-cog fa-lg" aria-hidden="true"></i><span
|
||||
aria-hidden="true"> {{'settings' | i18n}}</span>
|
||||
</a>
|
||||
</div>
|
||||
</form>
|
||||
|
@ -24,6 +24,8 @@ import { ModalComponent } from 'jslib/angular/components/modal.component';
|
||||
export class LoginComponent extends BaseLoginComponent {
|
||||
@ViewChild('environment', { read: ViewContainerRef }) environmentModal: ViewContainerRef;
|
||||
|
||||
showingModal = false;
|
||||
|
||||
constructor(authService: AuthService, router: Router,
|
||||
i18nService: I18nService, syncService: SyncService,
|
||||
private componentFactoryResolver: ComponentFactoryResolver, storageService: StorageService,
|
||||
@ -37,9 +39,17 @@ export class LoginComponent extends BaseLoginComponent {
|
||||
settings() {
|
||||
const factory = this.componentFactoryResolver.resolveComponentFactory(ModalComponent);
|
||||
const modal = this.environmentModal.createComponent(factory).instance;
|
||||
modal.onShown.subscribe(() => {
|
||||
this.showingModal = true;
|
||||
});
|
||||
modal.onClosed.subscribe(() => {
|
||||
this.showingModal = false;
|
||||
modal.onShown.unsubscribe();
|
||||
modal.onClosed.unsubscribe();
|
||||
});
|
||||
|
||||
const childComponent = modal.show<EnvironmentComponent>(EnvironmentComponent,
|
||||
this.environmentModal);
|
||||
|
||||
childComponent.onSaved.subscribe(() => {
|
||||
modal.close();
|
||||
});
|
||||
|
@ -1,4 +1,4 @@
|
||||
<form id="two-factor-page" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
|
||||
<form id="two-factor-page" #form (ngSubmit)="submit()" [appApiAction]="formPromise" attr.aria-hidden="{{showingModal}}">
|
||||
<div class="content">
|
||||
<h1>{{title}}</h1>
|
||||
<p *ngIf="selectedProviderType === providerType.Authenticator">{{'enterVerificationCodeApp' | i18n}}</p>
|
||||
|
@ -28,6 +28,8 @@ import { TwoFactorComponent as BaseTwoFactorComponent } from 'jslib/angular/comp
|
||||
export class TwoFactorComponent extends BaseTwoFactorComponent {
|
||||
@ViewChild('twoFactorOptions', { read: ViewContainerRef }) twoFactorOptionsModal: ViewContainerRef;
|
||||
|
||||
showingModal = false;
|
||||
|
||||
constructor(authService: AuthService, router: Router,
|
||||
i18nService: I18nService, apiService: ApiService,
|
||||
platformUtilsService: PlatformUtilsService, syncService: SyncService,
|
||||
@ -41,9 +43,17 @@ export class TwoFactorComponent extends BaseTwoFactorComponent {
|
||||
anotherMethod() {
|
||||
const factory = this.componentFactoryResolver.resolveComponentFactory(ModalComponent);
|
||||
const modal = this.twoFactorOptionsModal.createComponent(factory).instance;
|
||||
modal.onShown.subscribe(() => {
|
||||
this.showingModal = true;
|
||||
});
|
||||
modal.onClosed.subscribe(() => {
|
||||
this.showingModal = false;
|
||||
modal.onShown.unsubscribe();
|
||||
modal.onClosed.unsubscribe();
|
||||
});
|
||||
|
||||
const childComponent = modal.show<TwoFactorOptionsComponent>(TwoFactorOptionsComponent,
|
||||
this.twoFactorOptionsModal);
|
||||
|
||||
childComponent.onProviderSelected.subscribe(async (provider: TwoFactorProviderType) => {
|
||||
modal.close();
|
||||
this.selectedProviderType = provider;
|
||||
|
Loading…
Reference in New Issue
Block a user