From 9cd6627eed6dcde13ca73378d6e22086c371a6b0 Mon Sep 17 00:00:00 2001
From: MrTimscampi <julien.machiels@protonmail.com>
Date: Tue, 14 Apr 2020 02:57:51 +0200
Subject: [PATCH] Make API Keys table more accessible to screen readers

---
 src/apikeys.html       | 11 ++++++-----
 src/strings/en-us.json |  1 +
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/apikeys.html b/src/apikeys.html
index 7ca490724b..3cb7cd6de1 100644
--- a/src/apikeys.html
+++ b/src/apikeys.html
@@ -4,18 +4,19 @@
             <div class="detailSectionHeader">
                 <h2 style="margin:.6em 0;vertical-align:middle;display:inline-block;">${HeaderApiKeys}</h2>
                 <button is="emby-button" type="button" class="fab btnNewKey submit" style="margin-left:1em;" title="${ButtonAdd}">
-                    <span class="material-icons add"></span>
+                    <span class="material-icons add" aria-hidden="true"></span>
                 </button>
             </div>
             <p>${HeaderApiKeysHelp}</p>
             <br />
             <table class="tblApiKeys detailTable">
+                <caption class="clipForScreenReader">${ApiKeysCaption}</caption>
                 <thead>
                     <tr>
-                        <th class="detailTableHeaderCell"></th>
-                        <th class="detailTableHeaderCell">${HeaderApiKey}</th>
-                        <th class="detailTableHeaderCell">${HeaderApp}</th>
-                        <th class="detailTableHeaderCell">${HeaderDateIssued}</th>
+                        <th scope="col" class="detailTableHeaderCell"></th>
+                        <th scope="col" class="detailTableHeaderCell">${HeaderApiKey}</th>
+                        <th scope="col" class="detailTableHeaderCell">${HeaderApp}</th>
+                        <th scope="col" class="detailTableHeaderCell">${HeaderDateIssued}</th>
                     </tr>
                 </thead>
                 <tbody class="resultBody"></tbody>
diff --git a/src/strings/en-us.json b/src/strings/en-us.json
index 9895bbc05c..e2ec736b60 100644
--- a/src/strings/en-us.json
+++ b/src/strings/en-us.json
@@ -311,6 +311,7 @@
     "HeaderApiKey": "API Key",
     "HeaderApiKeys": "API Keys",
     "HeaderApiKeysHelp": "External applications are required to have an API key in order to communicate with Jellyfin Server. Keys are issued by logging in with a Jellyfin account, or by manually granting the application a key.",
+    "ApiKeysCaption": "List of the currently enable API keys",
     "HeaderApp": "App",
     "HeaderAppearsOn": "Appears On",
     "HeaderAudioBooks": "Audio Books",