a11y improvements for toastr and filters area

jslib

@@ -1 +1 @@
-Subproject commit 1044a8759ac3bbd72ccdee9d5a2b12373bb0004f
+Subproject commit e5d6861662967f6cc8ed33d81600cfabd9120fa0

src/app/app.component.ts

@@ -57,7 +57,7 @@ const IdleTimeout = 60000 * 10; // 10 minutes
     selector: 'app-root',
     styles: [],
     template: `
-        <toaster-container [toasterconfig]="toasterConfig"></toaster-container>
+        <toaster-container [toasterconfig]="toasterConfig" aria-live="polite"></toaster-container>
         <ng-template #settings></ng-template>
         <ng-template #premium></ng-template>
         <ng-template #passwordHistory></ng-template>

src/app/vault/groupings.component.html

@@ -1,5 +1,6 @@
 <div class="content">
     <div class="inner-content">
+        <h2 class="sr-only">{{'filters' | i18n}}</h2>
         <ul>
             <li [ngClass]="{active: selectedAll}">
                 <a href="#" appStopClick appBlurClick (click)="selectAll()">
@@ -37,12 +38,12 @@
         </ul>
         <p *ngIf="!loaded" class="text-muted">{{'loading' | i18n}}</p>
         <ng-container *ngIf="loaded">
-            <h2>
-                {{'folders' | i18n}}
+            <div class="heading">
+                <h2>{{'folders' | i18n}}</h2>
                 <button appBlurClick (click)="addFolder()" appA11yTitle="{{'addFolder' | i18n}}">
                     <i class="fa fa-plus fa-fw" aria-hidden="true"></i>
                 </button>
-            </h2>
+            </div>
             <ul class="fa-ul">
                 <ng-template #recursiveFolders let-folders>
                     <li *ngFor="let f of folders"

src/locales/en/messages.json

@@ -2,6 +2,9 @@
   "bitwarden": {
     "message": "Bitwarden"
   },
+  "filters": {
+    "message": "Filters"
+  },
   "allItems": {
     "message": "All Items"
   },

src/scss/vault.scss

@@ -38,11 +38,14 @@
             font-size: $font-size-base;
             font-weight: normal;
             margin-bottom: 5px;
-            display: flex;
 
             @include themify($themes) {
                 color: themed('headingColor');
             }
+        }
+
+        .heading {
+            display: flex;
 
             button {
                 margin-left: auto;