Fixes for dynamic modal a11y (#1107)

* Remove tabindex and cdkTrapFocus from modals

* Add styling for modal-dismiss

* Remove modal-dismiss styles

* Update jslib
This commit is contained in:
Thomas Rittson 2021-10-25 16:26:12 +10:00 committed by GitHub
parent a61ef74895
commit 52a30f4d8a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
16 changed files with 17 additions and 17 deletions

2
jslib

@ -1 +1 @@
Subproject commit f09fb69882525b3be7b2e257e7723eeb79b343d1
Subproject commit 24fe836032354d4ec39435776e54dd0995e1b389

View File

@ -1,4 +1,4 @@
<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" attr.aria-label="{{'settings' | i18n}}">
<div class="modal fade" role="dialog" aria-modal="true" attr.aria-label="{{'settings' | i18n}}">
<div class="modal-dialog" role="document">
<form class="modal-content" (ngSubmit)="submit()">
<div class="modal-body">

View File

@ -1,4 +1,4 @@
<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="premiumTitle">
<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="premiumTitle">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-body">

View File

@ -1,4 +1,4 @@
<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" attr.aria-label="{{'settings' | i18n}}" cdkTrapFocus cdkTrapFocusAutoCapture>
<div class="modal fade" role="dialog" aria-modal="true" attr.aria-label="{{'settings' | i18n}}">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-body form">

View File

@ -1,4 +1,4 @@
<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="twoStepTitle">
<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="twoStepTitle">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-body">

View File

@ -5,7 +5,7 @@
<div [formGroup]="form">
<div class="form-group">
<label for="vaultTimeout">{{'vaultTimeout' | i18n}}</label>
<select id="vaultTimeout" name="VaultTimeout" formControlName="vaultTimeout" class="form-control">
<select id="vaultTimeout" name="VaultTimeout" formControlName="vaultTimeout" class="form-control" appAutofocus>
<option *ngFor="let o of vaultTimeouts" [ngValue]="o.value">{{o.name}}</option>
</select>
<small class="form-text text-muted">{{'vaultTimeoutDesc' | i18n}}</small>

View File

@ -1,4 +1,4 @@
<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true">
<div class="modal fade" role="dialog" aria-modal="true">
<div class="modal-dialog modal-dialog-scrollable" role="document">
<form class="modal-content" #form (ngSubmit)="submit()">
<div class="modal-body">

View File

@ -1,4 +1,4 @@
<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" cdkTrapFocus cdkTrapFocusAutoCapture>
<div class="modal fade" role="dialog" aria-modal="true">
<div class="modal-dialog modal-dialog-scrollable set-pin-modal" role="document">
<form class="modal-content" #form (ngSubmit)="submit()">
<div class="modal-body">
@ -11,7 +11,7 @@
<div class="row-main">
<label for="pin">{{'pin' | i18n}}</label>
<input id="pin" type="{{showPin ? 'text' : 'password'}}" name="Pin" class="monospaced"
[(ngModel)]="pin" required appInputVerbatim cdkFocusInitial>
[(ngModel)]="pin" required appInputVerbatim appAutofocus>
</div>
<div class="action-buttons">
<a class="row-btn" href="#" appStopClick appBlurClick

View File

@ -1,4 +1,4 @@
<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="attachmentsTitle">
<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="attachmentsTitle">
<div class="modal-dialog" role="document">
<form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
<div class="modal-body">

View File

@ -1,4 +1,4 @@
<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="collectionsTitle">
<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="collectionsTitle">
<div class="modal-dialog" role="document">
<form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
<div class="modal-body">

View File

@ -1,4 +1,4 @@
<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="exportTitle">
<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="exportTitle">
<div class="modal-dialog" role="document">
<form class="modal-content" #form (ngSubmit)="submit()">
<div class="modal-body">

View File

@ -1,4 +1,4 @@
<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="folderAddEditTitle">
<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="folderAddEditTitle">
<div class="modal-dialog modal-sm" role="document">
<form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
<div class="modal-body">

View File

@ -1,4 +1,4 @@
<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="passwordGenHistoryTitle">
<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="passwordGenHistoryTitle">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-body">

View File

@ -1,4 +1,4 @@
<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" attr.aria-label="{{'generatePassword' | i18n}}">
<div class="modal fade" role="dialog" aria-modal="true" attr.aria-label="{{'generatePassword' | i18n}}">
<div class="modal-dialog modal-sm" role="document">
<div class="modal-content">
<div class="modal-body">

View File

@ -1,4 +1,4 @@
<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="passwordHistoryTitle">
<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="passwordHistoryTitle">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-body">

View File

@ -1,4 +1,4 @@
<div class="modal fade" tabindex="-1" role="dialog" aria-modal="true" aria-labelledby="moveToOrgTitle">
<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="moveToOrgTitle">
<div class="modal-dialog" role="document">
<form class="modal-content" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
<div class="modal-body">