From 28627fe3528c23a41781deb2d4a8bb001540c8d0 Mon Sep 17 00:00:00 2001
From: Dannon Baker <dannon.baker@gmail.com>
Date: Thu, 18 Aug 2022 17:29:31 -0400
Subject: [PATCH] Masthead a11y; for icon-only tabs display the tooltip as a
 sr-only text placeholder.

---
 client/src/components/Masthead/MastheadItem.vue | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/client/src/components/Masthead/MastheadItem.vue b/client/src/components/Masthead/MastheadItem.vue
index c50bc581002..124bc4d6c09 100644
--- a/client/src/components/Masthead/MastheadItem.vue
+++ b/client/src/components/Masthead/MastheadItem.vue
@@ -12,6 +12,8 @@
         :title="tab.tooltip"
         @click="open(tab, $event)">
         <template v-if="tab.icon">
+            <!-- If this is an icon-based tab, inject tooltip directly for screen readers -->
+            <span class="sr-only">{{ tab.tooltip || tab.id }}</span>
             <span :class="iconClasses" />
             <span v-if="toggle" class="nav-note fa fa-check" />
         </template>