From: Stephanie Leary <stephanie.leary@equinoxoli.org>
Date: Fri, 17 Mar 2023 14:35:15 +0000 (+0000)
Subject: Wrapper and outline for keyboard navigation
X-Git-Url: https://old-git.evergreen-ils.org/?a=commitdiff_plain;h=f4ef35d5a5f644e20f6a1db901f679082f3288d4;p=working%2FEvergreen.git

Wrapper and outline for keyboard navigation

Signed-off-by: Stephanie Leary <stephanie.leary@equinoxoli.org>
---

diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid.component.css b/Open-ILS/src/eg2/src/app/share/grid/grid.component.css
index 6e95476148..3b6f59892d 100644
--- a/Open-ILS/src/eg2/src/app/share/grid/grid.component.css
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid.component.css
@@ -1,3 +1,10 @@
+.eg-grid-wrapper {
+  overflow-x: auto;
+}
+
+[role="region"][aria-labelledby][tabindex]:focus {
+  outline: 2px solid #0A58CA;
+}
 
 .eg-grid {
     width: 100%;
diff --git a/Open-ILS/src/eg2/src/app/share/grid/grid.component.html b/Open-ILS/src/eg2/src/app/share/grid/grid.component.html
index c3cd6087e6..f1a7fb5ca0 100644
--- a/Open-ILS/src/eg2/src/app/share/grid/grid.component.html
+++ b/Open-ILS/src/eg2/src/app/share/grid/grid.component.html
@@ -1,4 +1,4 @@
-<div class="eg-grid-wrapper">
+<div class="eg-grid-wrapper" role="region" aria-labelledby="eg-grid-caption" tabindex="0">
   <eg-grid-toolbar #toolbar
     [gridContext]="context"
     [disableSaveSettings]="!persistKey || ('disabled' === persistKey)">
@@ -10,13 +10,13 @@
   </eg-grid-toolbar-actions-menu>
 </ng-template>
 
-<table class="eg-grid eg-grid-table table" tabindex="1" role="table">
+<table class="eg-grid eg-grid-table table" role="table">
   
   <!-- eg-grid-column-width -->
 
   <!-- eg-grid-print -->
 
-    <caption>
+    <caption id="eg-grid-caption">
     <ng-container *ngIf="dataSource.data.length === 0">
       <ng-container *ngIf="dataSource.requestingData">
         <span>