From a01b38fae9d06f483a94ffb6161b658aca59b2aa Mon Sep 17 00:00:00 2001
From: Kyle Spearrin <kyle.spearrin@gmail.com>
Date: Tue, 2 Apr 2019 08:43:28 -0400
Subject: [PATCH] a11y improvements for toastr and filters area

---
 jslib                                  | 2 +-
 src/app/app.component.ts               | 2 +-
 src/app/vault/groupings.component.html | 7 ++++---
 src/locales/en/messages.json           | 3 +++
 src/scss/vault.scss                    | 5 ++++-
 5 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/jslib b/jslib
index 1044a8759a..e5d6861662 160000
--- a/jslib
+++ b/jslib
@@ -1 +1 @@
-Subproject commit 1044a8759ac3bbd72ccdee9d5a2b12373bb0004f
+Subproject commit e5d6861662967f6cc8ed33d81600cfabd9120fa0
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 1640a02cb7..2d8e6738d1 100644
--- a/src/app/app.component.ts
+++ b/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>
diff --git a/src/app/vault/groupings.component.html b/src/app/vault/groupings.component.html
index 8016e0f3ff..db23bad831 100644
--- a/src/app/vault/groupings.component.html
+++ b/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"
diff --git a/src/locales/en/messages.json b/src/locales/en/messages.json
index 074c202d7d..a955dad340 100644
--- a/src/locales/en/messages.json
+++ b/src/locales/en/messages.json
@@ -2,6 +2,9 @@
   "bitwarden": {
     "message": "Bitwarden"
   },
+  "filters": {
+    "message": "Filters"
+  },
   "allItems": {
     "message": "All Items"
   },
diff --git a/src/scss/vault.scss b/src/scss/vault.scss
index 9effed29a4..6f6fdfd087 100644
--- a/src/scss/vault.scss
+++ b/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;