a11y improvements for toastr and filters area
This commit is contained in:
parent
a91a521722
commit
a01b38fae9
2
jslib
2
jslib
|
@ -1 +1 @@
|
||||||
Subproject commit 1044a8759ac3bbd72ccdee9d5a2b12373bb0004f
|
Subproject commit e5d6861662967f6cc8ed33d81600cfabd9120fa0
|
|
@ -57,7 +57,7 @@ const IdleTimeout = 60000 * 10; // 10 minutes
|
||||||
selector: 'app-root',
|
selector: 'app-root',
|
||||||
styles: [],
|
styles: [],
|
||||||
template: `
|
template: `
|
||||||
<toaster-container [toasterconfig]="toasterConfig"></toaster-container>
|
<toaster-container [toasterconfig]="toasterConfig" aria-live="polite"></toaster-container>
|
||||||
<ng-template #settings></ng-template>
|
<ng-template #settings></ng-template>
|
||||||
<ng-template #premium></ng-template>
|
<ng-template #premium></ng-template>
|
||||||
<ng-template #passwordHistory></ng-template>
|
<ng-template #passwordHistory></ng-template>
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<div class="inner-content">
|
<div class="inner-content">
|
||||||
|
<h2 class="sr-only">{{'filters' | i18n}}</h2>
|
||||||
<ul>
|
<ul>
|
||||||
<li [ngClass]="{active: selectedAll}">
|
<li [ngClass]="{active: selectedAll}">
|
||||||
<a href="#" appStopClick appBlurClick (click)="selectAll()">
|
<a href="#" appStopClick appBlurClick (click)="selectAll()">
|
||||||
|
@ -37,12 +38,12 @@
|
||||||
</ul>
|
</ul>
|
||||||
<p *ngIf="!loaded" class="text-muted">{{'loading' | i18n}}</p>
|
<p *ngIf="!loaded" class="text-muted">{{'loading' | i18n}}</p>
|
||||||
<ng-container *ngIf="loaded">
|
<ng-container *ngIf="loaded">
|
||||||
<h2>
|
<div class="heading">
|
||||||
{{'folders' | i18n}}
|
<h2>{{'folders' | i18n}}</h2>
|
||||||
<button appBlurClick (click)="addFolder()" appA11yTitle="{{'addFolder' | i18n}}">
|
<button appBlurClick (click)="addFolder()" appA11yTitle="{{'addFolder' | i18n}}">
|
||||||
<i class="fa fa-plus fa-fw" aria-hidden="true"></i>
|
<i class="fa fa-plus fa-fw" aria-hidden="true"></i>
|
||||||
</button>
|
</button>
|
||||||
</h2>
|
</div>
|
||||||
<ul class="fa-ul">
|
<ul class="fa-ul">
|
||||||
<ng-template #recursiveFolders let-folders>
|
<ng-template #recursiveFolders let-folders>
|
||||||
<li *ngFor="let f of folders"
|
<li *ngFor="let f of folders"
|
||||||
|
|
|
@ -2,6 +2,9 @@
|
||||||
"bitwarden": {
|
"bitwarden": {
|
||||||
"message": "Bitwarden"
|
"message": "Bitwarden"
|
||||||
},
|
},
|
||||||
|
"filters": {
|
||||||
|
"message": "Filters"
|
||||||
|
},
|
||||||
"allItems": {
|
"allItems": {
|
||||||
"message": "All Items"
|
"message": "All Items"
|
||||||
},
|
},
|
||||||
|
|
|
@ -38,11 +38,14 @@
|
||||||
font-size: $font-size-base;
|
font-size: $font-size-base;
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
display: flex;
|
|
||||||
|
|
||||||
@include themify($themes) {
|
@include themify($themes) {
|
||||||
color: themed('headingColor');
|
color: themed('headingColor');
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.heading {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
button {
|
button {
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
|
|
Loading…
Reference in New Issue