Improve accessibility of links without href (#1915)

6 files changed, 81 insertions, 81 deletions

diff --git a/ext/action-popup.html b/ext/action-popup.html
index a3128537..a4dac829 100644
--- a/ext/action-popup.html
+++ b/ext/action-popup.html
@@ -31,24 +31,24 @@
                 <optgroup label="Primary Profile" id="profile-select-option-group"></optgroup>
             </select></span>
         </button>
-        <a class="nav-button action-open-settings" title="Settings" data-hotkey='["global:openSettingsPage","title","Settings ({0})"]'>
+        <a tabindex="0" class="nav-button action-open-settings" title="Settings" data-hotkey='["global:openSettingsPage","title","Settings ({0})"]'>
             <span class="icon" data-icon="cog"></span>
             <div class="nav-button-warning-badge no-dictionaries-enabled-warning" hidden>
                 <div class="nav-button-warning-badge-outer"></div>
                 <div class="nav-button-warning-badge-inner"></div>
             </div>
         </a>
-        <a class="nav-button action-open-permissions" title="Permissions" hidden>
+        <a tabindex="0" class="nav-button action-open-permissions" title="Permissions" hidden>
             <span class="icon" data-icon="key"></span>
             <div class="nav-button-warning-badge permissions-required-warning" hidden>
                 <div class="nav-button-warning-badge-outer"></div>
                 <div class="nav-button-warning-badge-inner"></div>
             </div>
         </a>
-        <a class="nav-button action-open-search" title="Search" data-hotkey='["global:openSearchPage","title","Search ({0})\nShift+click to open here"]'>
+        <a tabindex="0" class="nav-button action-open-search" title="Search" data-hotkey='["global:openSearchPage","title","Search ({0})\nShift+click to open here"]'>
             <span class="icon" data-icon="magnifying-glass"></span>
         </a>
-        <a class="nav-button action-open-info" title="Information" data-hotkey='["global:openInfoPage","title","Information ({0})"]'>
+        <a tabindex="0" class="nav-button action-open-info" title="Information" data-hotkey='["global:openInfoPage","title","Information ({0})"]'>
             <span class="icon" data-icon="question-mark-circle"></span>
         </a>
     </div>
@@ -59,24 +59,24 @@
     <label class="link-group">
         <span class="link-group-icon"><input type="checkbox" id="enable-search2"></span><span class="link-group-label">Enable content scanning</span>
     </label>
-    <a class="link-group action-open-settings">
+    <a tabindex="0" class="link-group action-open-settings">
         <span class="link-group-icon" data-icon="chevron"></span>
         <span class="link-group-label">Settings</span>
         <span class="link-group-badge">
             <div class="flex-margin-left warning-badge no-dictionaries-enabled-warning" hidden><span class="icon" data-icon="exclamation-point-short"></span></div>
         </span>
     </a>
-    <a class="link-group action-open-permissions" hidden>
+    <a tabindex="0" class="link-group action-open-permissions" hidden>
         <span class="link-group-icon" data-icon="chevron"></span>
         <span class="link-group-label">Permissions</span>
         <span class="link-group-badge">
             <div class="flex-margin-left warning-badge permissions-required-warning" hidden><span class="icon" data-icon="exclamation-point-short"></span></div>
         </span>
     </a>
-    <a class="link-group action-open-search">
+    <a tabindex="0" class="link-group action-open-search">
         <span class="link-group-icon" data-icon="chevron"></span><span class="link-group-label">Search</span>
     </a>
-    <a class="link-group action-open-info">
+    <a tabindex="0" class="link-group action-open-info">
         <span class="link-group-icon" data-icon="chevron"></span><span class="link-group-label">Information</span>
     </a>
 </div>
diff --git a/ext/display-templates.html b/ext/display-templates.html
index cf171aa5..9deb1ff5 100644
--- a/ext/display-templates.html
+++ b/ext/display-templates.html
@@ -29,7 +29,7 @@
             <ol class="entry-body-section-content definition-list"></ol>
         </div>
     </div>
-    <div class="debug-info"><a class="debug-log-link">Log debug info to console</a></div>
+    <div class="debug-info"><a tabindex="0" class="debug-log-link">Log debug info to console</a></div>
 </div></template>
 <template id="headword-template" data-remove-whitespace-text="true"><div class="headword">
     <div class="headword-text-container">
@@ -124,7 +124,7 @@
         <tr><th colspan="3">Dictionary Indices</th></tr>
         <tr><td colspan="3" class="kanji-dictionary-indices"></td></tr>
     </tbody></table>
-    <div class="debug-info"><a class="debug-log-link">Log debug info to console</a></div>
+    <div class="debug-info"><a tabindex="0" class="debug-log-link">Log debug info to console</a></div>
 </div></template>
 <template id="kanji-info-table-template"><table class="kanji-info-table"><tbody class="kanji-info-table-body"></tbody></table></template>
 <template id="kanji-info-table-item-template"><tr class="kanji-info-table-item"><th class="kanji-info-table-item-header"></th><td class="kanji-info-table-item-value"></td></tr></template>
@@ -150,7 +150,7 @@
 <template id="footer-notification-anki-errors-content-template" data-remove-whitespace-text="true"><div class="anki-note-error-info">
     <div class="anki-note-error-header"></div>
     <ul class="anki-note-error-list"></ul>
-    <div class="anki-note-error-log-container"><a class="anki-note-error-log-link">Log debug info to console</a></div>
+    <div class="anki-note-error-log-container"><a tabindex="0" class="anki-note-error-log-link">Log debug info to console</a></div>
 </div></template>
 <template id="profile-list-item-template"><label class="profile-list-item">
     <div class="profile-list-item-selection"><label class="radio"><input type="radio" class="profile-entry-is-default-radio" name="profile-entry-default-radio"><span class="radio-body"><span class="radio-border"></span><span class="radio-dot"></span></span></label></div>
diff --git a/ext/info.html b/ext/info.html
index c557eefe..8fb48499 100644
--- a/ext/info.html
+++ b/ext/info.html
@@ -36,7 +36,7 @@
                 <li>User agent: <span id="user-agent"></span></li>
                 <li>AnkiConnect version: <span id="anki-connect-version-container"><span id="anki-connect-version">&hellip;</span><em class="light" id="anki-connect-version-unknown-message" hidden> (Anki not running or connected)</em></span></li>
                 <li>Installed dictionaries: <span id="installed-dictionaries">&hellip;</span><em id="installed-dictionaries-none" hidden>None installed</em></li>
-                <li><a id="settings-export-button">Export settings</a></li>
+                <li><a tabindex="0" id="settings-export-button">Export settings</a></li>
             </ul>
         </div></div></div></div>
     </div>
diff --git a/ext/permissions.html b/ext/permissions.html
index 90a6b394..49daa940 100644
--- a/ext/permissions.html
+++ b/ext/permissions.html
@@ -131,7 +131,7 @@
                         When enabled, Yomichan is able to scan text and show definitions in private/incognito web browser windows.
                     </p>
                     <p>
-                        This option can be configured from the web browser's <a class="extension-settings-link" data-special-url="chrome://extensions/?id={id}">extension settings pages</a>.
+                        This option can be configured from the web browser's <a tabindex="0" class="extension-settings-link" data-special-url="chrome://extensions/?id={id}">extension settings pages</a>.
                     </p>
                 </div>
             </div>
@@ -147,7 +147,7 @@
                         When enabled, Yomichan is able to scan text and show definitions on local HTML files located using the <code>file://*</code> scheme.
                     </p>
                     <p data-show-for-browser="chrome edge">
-                        This option can be configured from the web browser's <a class="extension-settings-link" data-special-url="chrome://extensions/?id={id}">extension settings pages</a>.
+                        This option can be configured from the web browser's <a tabindex="0" class="extension-settings-link" data-special-url="chrome://extensions/?id={id}">extension settings pages</a>.
                     </p>
                 </div>
             </div>
diff --git a/ext/settings.html b/ext/settings.html
index f3ed6577..0e1fafcc 100644
--- a/ext/settings.html
+++ b/ext/settings.html
@@ -157,7 +157,7 @@
                     <div class="settings-item-label">Persistent storage</div>
                     <div class="settings-item-description">
                         Enable to help prevent the browser from unexpectedly clearing the database.
-                        <a class="more-toggle more-only" data-parent-distance="4">More&hellip;</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">More&hellip;</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -186,7 +186,7 @@
                     the <code>unlimitedStorage</code> permission, which should prevent data deletion.<sup><a href="https://bugs.chromium.org/p/chromium/issues/detail?id=680392#c15" target="_blank" rel="noopener">[1]</a></sup>
                 </p>
                 <p>
-                    <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                 </p>
             </div>
         </div>
@@ -220,7 +220,7 @@
                     <div class="settings-item-label">Result grouping mode</div>
                     <div class="settings-item-description">
                         Change how related results are grouped.
-                        <a class="more-toggle more-only" data-parent-distance="4">More&hellip;</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">More&hellip;</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -263,7 +263,7 @@
                     </li>
                 </ul>
                 <p>
-                    <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                 </p>
             </div>
             <div class="settings-item-children settings-item-children-group" id="main-dictionary-container" hidden>
@@ -308,7 +308,7 @@
                     <div class="settings-item-label">Scan modifier key</div>
                     <div class="settings-item-description">
                         Hold a key while moving the cursor to scan text.
-                        <a class="more-toggle more-only" data-parent-distance="4">More&hellip;</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">More&hellip;</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -326,7 +326,7 @@
                     and clicking <em data-modal-action="show,scanning-inputs">Configure advanced scanning inputs</em>.
                 </p>
                 <p>
-                    <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                 </p>
             </div>
         </div>
@@ -431,7 +431,7 @@
                 <div class="settings-item-left">
                     <div class="settings-item-label">
                         Support inputs for devices with touch screens
-                        <a class="more-toggle more-only" data-parent-distance="4">(?)</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">(?)</a>
                     </div>
                 </div>
                 <div class="settings-item-right flex-row-wrap">
@@ -458,7 +458,7 @@
                     The <em>Pointer inputs</em> option is only visible when the <em>Advanced</em> option is enabled.
                 </p>
                 <p>
-                    <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                 </p>
             </div>
         </div>
@@ -530,7 +530,7 @@
                 <div class="settings-item-left">
                     <div class="settings-item-label">
                         Show iframe popups in the root frame
-                        <a class="more-toggle more-only" data-parent-distance="4">(?)</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">(?)</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -549,7 +549,7 @@
                     This typically does not cause issues, but if anything unexpected happens, this option could be the cause.
                 </p>
                 <p>
-                    <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                 </p>
             </div>
         </div>
@@ -724,7 +724,7 @@
                 <div class="settings-item-left">
                     <div class="settings-item-label">
                         Pitch accent display styles
-                        <a class="more-toggle more-only" data-parent-distance="4">(?)</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">(?)</a>
                     </div>
                 </div>
                 <div class="settings-item-right flex-row-wrap">
@@ -779,7 +779,7 @@
                     </li>
                 </ul>
                 <p>
-                    <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                 </p>
             </div>
         </div>
@@ -813,7 +813,7 @@
                     <div class="settings-item-label">Display mode</div>
                     <div class="settings-item-description">
                         Change the layout of the popup.
-                        <a class="more-toggle more-only" data-parent-distance="4">More&hellip;</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">More&hellip;</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -830,7 +830,7 @@
                     the full width of the screen, which can be useful on devices with touch screens.
                 </p>
                 <p>
-                    <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                 </p>
             </div>
         </div>
@@ -873,7 +873,7 @@
                         <div class="settings-item-left">
                             <div class="settings-item-label">
                                 Auto-scale
-                                <a class="more-toggle more-only" data-parent-distance="4">(?)</a>
+                                <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">(?)</a>
                             </div>
                         </div>
                         <div class="settings-item-right flex-row-wrap">
@@ -897,7 +897,7 @@
                             and <em>Viewport</em> uses the zoom level that is typically used on mobile browsers.
                         </p>
                         <p>
-                            <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                            <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                         </p>
                     </div>
                 </div>
@@ -990,7 +990,7 @@
     <div class="heading-container advanced-only">
         <div class="heading-container-icon"><span class="icon" data-icon="window"></span></div>
         <div class="heading-container-left"><h2 id="window"><a href="#!window">Window</a></h2></div>
-        <div class="heading-container-right"><a class="heading-link-light" id="test-window-open-link">Open&hellip;</a></div>
+        <div class="heading-container-right"><a tabindex="0" class="heading-link-light" id="test-window-open-link">Open&hellip;</a></div>
     </div>
     <div class="settings-group advanced-only">
         <div class="settings-item">
@@ -998,7 +998,7 @@
                 <div class="settings-item-left">
                     <div class="settings-item-label">
                         Use a native browser window instead of an embedded popup
-                        <a class="more-toggle more-only" data-parent-distance="4">(?)</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">(?)</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -1012,7 +1012,7 @@
                     This window will be shared across all tabs.
                 </p>
                 <p>
-                    <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                 </p>
             </div>
         </div>
@@ -1183,7 +1183,7 @@
         <div class="heading-container">
             <div class="heading-container-icon"><span class="icon" data-icon="text-parsing"></span></div>
             <div class="heading-container-left"><h2 id="text-parsing"><a href="#!text-parsing">Text Parsing</a></h2></div>
-            <div class="heading-container-right"><a class="more-toggle more-only heading-link-light" data-parent-distance="3">Info&hellip;</a></div>
+            <div class="heading-container-right"><a tabindex="0" class="more-toggle more-only heading-link-light" data-parent-distance="3">Info&hellip;</a></div>
         </div>
         <div class="heading-description more" hidden>
             <p>
@@ -1192,7 +1192,7 @@
                 This information can be added to Anki cards to provide additional context.
             </p>
             <p>
-                <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
             </p>
         </div>
     </div>
@@ -1213,7 +1213,7 @@
                     <div class="settings-item-label">Parse text using <a href="https://en.wikipedia.org/wiki/MeCab" target="_blank" rel="noopener noreferrer">MeCab</a></div>
                     <div class="settings-item-description">
                         Requires a native component to be installed that Yomichan will connect to.
-                        <a class="more-toggle more-only" data-parent-distance="4">More&hellip;</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">More&hellip;</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -1231,7 +1231,7 @@
                     <div id="test-mecab-results" class="flex-margin-left" hidden></div>
                 </div>
                 <p class="margin-above">
-                    <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                 </p>
             </div>
         </div>
@@ -1302,7 +1302,7 @@
         <div class="heading-container">
             <div class="heading-container-icon"><span class="icon" data-icon="translation"></span></div>
             <div class="heading-container-left"><h2 id="translation"><a href="#!translation">Translation</a></h2></div>
-            <div class="heading-container-right"><a class="more-toggle more-only heading-link-light" data-parent-distance="3">Info&hellip;</a></div>
+            <div class="heading-container-right"><a tabindex="0" class="more-toggle more-only heading-link-light" data-parent-distance="3">Info&hellip;</a></div>
         </div>
         <div class="heading-description more" hidden>
             <p>
@@ -1329,7 +1329,7 @@
                 </li>
             </ul>
             <p>
-                <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
             </p>
         </div>
     </div>
@@ -1427,7 +1427,7 @@
         <div class="heading-container">
             <div class="heading-container-icon"><span class="icon" data-icon="note-card"></span></div>
             <div class="heading-container-left"><h2 id="anki"><a href="#!anki">Anki</a></h2></div>
-            <div class="heading-container-right"><a class="more-toggle more-only heading-link-light" data-parent-distance="3">Info&hellip;</a></div>
+            <div class="heading-container-right"><a tabindex="0" class="more-toggle more-only heading-link-light" data-parent-distance="3">Info&hellip;</a></div>
         </div>
         <div class="heading-description more" hidden>
             <p>
@@ -1436,7 +1436,7 @@
                 This feature requires installation of the <a href="https://foosoft.net/projects/anki-connect/" target="_blank" rel="noopener noreferrer">AnkiConnect</a> plugin.
             </p>
             <p>
-                <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
             </p>
         </div>
     </div>
@@ -1447,7 +1447,7 @@
                     <div class="settings-item-label">Enable Anki integration</div>
                     <div class="settings-item-description">
                         <span>Connection status:</span>
-                        <span id="anki-error-message">&hellip;</span> <a id="anki-error-message-details-toggle" hidden>Details&hellip;</a>
+                        <span id="anki-error-message">&hellip;</span> <a tabindex="0" id="anki-error-message-details-toggle" hidden>Details&hellip;</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -1476,7 +1476,7 @@
                     <div class="settings-item-label">AnkiConnect server address</div>
                     <div class="settings-item-description">
                         Change the URL of the AnkiConnect server.
-                        <a class="more-toggle more-only" data-parent-distance="4">More&hellip;</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">More&hellip;</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -1489,7 +1489,7 @@
                     If Anki is running and AnkiConnect is installed, clicking this URL should open a page showing the current version of AnkiConnect.
                 </p>
                 <p>
-                    <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                 </p>
             </div>
         </div>
@@ -1529,7 +1529,7 @@
                         <div class="settings-item-left">
                             <div class="settings-item-label">
                                 Check for duplicates across all models
-                                <a class="more-toggle more-only" data-parent-distance="4">(?)</a>
+                                <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">(?)</a>
                             </div>
                         </div>
                         <div class="settings-item-right">
@@ -1542,7 +1542,7 @@
                             Enabling this option will check for duplicates across <em>all</em> model types.
                         </p>
                         <p>
-                            <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                            <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                         </p>
                     </div>
                 </div>
@@ -1551,7 +1551,7 @@
                         <div class="settings-item-left">
                             <div class="settings-item-label">
                                 Duplicate card scope
-                                <a class="more-toggle more-only" data-parent-distance="4">(?)</a>
+                                <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">(?)</a>
                             </div>
                         </div>
                         <div class="settings-item-right">
@@ -1575,7 +1575,7 @@
                             For decks which don't have any parent-child hierarchy, both options function the same.
                         </p>
                         <p>
-                            <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                            <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                         </p>
                     </div>
                 </div>
@@ -1623,7 +1623,7 @@
                 <div class="settings-item-left">
                     <div class="settings-item-label">
                         Show card tags
-                        <a class="more-toggle more-only" data-parent-distance="4">(?)</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">(?)</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -1642,7 +1642,7 @@
                     then the button will not be shown.
                 </p>
                 <p>
-                    <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                 </p>
             </div>
         </div>
@@ -1669,7 +1669,7 @@
         <div class="heading-container">
             <div class="heading-container-icon"><span class="icon" data-icon="clipboard"></span></div>
             <div class="heading-container-left"><h2 id="clipboard"><a href="#!clipboard">Clipboard</a></h2></div>
-            <div class="heading-container-right"><a class="more-toggle more-only heading-link-light" data-parent-distance="3">Info&hellip;</a></div>
+            <div class="heading-container-right"><a tabindex="0" class="more-toggle more-only heading-link-light" data-parent-distance="3">Info&hellip;</a></div>
         </div>
         <div class="heading-description more" hidden>
             <p>
@@ -1682,7 +1682,7 @@
                 the clipboard will be frequently checked for new text.
             </p>
             <p>
-                <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
             </p>
         </div>
     </div>
@@ -1828,7 +1828,7 @@
                 <div class="settings-item-left">
                     <div class="settings-item-label">
                         Force HTML-based rendering for Google Docs
-                        <a class="more-toggle more-only" data-parent-distance="4">(?)</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">(?)</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -1844,7 +1844,7 @@
                     Enabling this option will force HTML-based rendering to be used.
                 </p>
                 <p>
-                    <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                 </p>
             </div>
         </div>
@@ -1861,7 +1861,7 @@
                 <div class="settings-item-left">
                     <div class="settings-item-label">
                         Use a secure container around popups
-                        <a class="more-toggle more-only" data-parent-distance="4">(?)</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">(?)</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -1876,7 +1876,7 @@
                     which helps avoid situations where the web page might try to modify or use the Yomichan popup for an unintended purpose.
                 </p>
                 <p>
-                    <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                 </p>
             </div>
         </div>
@@ -1885,7 +1885,7 @@
                 <div class="settings-item-left">
                     <div class="settings-item-label">
                         Use secure popup frame URL
-                        <a class="more-toggle more-only" data-parent-distance="4">(?)</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">(?)</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -1901,7 +1901,7 @@
                     to detect the presence of Yomichan.
                 </p>
                 <p>
-                    <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                 </p>
             </div>
         </div>
@@ -1940,7 +1940,7 @@
 
 <div class="status-footer-container" hidden><div class="status-footer-container2">
     <div class="status-footer">
-        <div class="status-footer-header"><div class="status-footer-header-label">Tasks in progress:</div><a class="status-footer-header-close">Close</a></div>
+        <div class="status-footer-header"><div class="status-footer-header-label">Tasks in progress:</div><a tabindex="0" class="status-footer-header-close">Close</a></div>
         <div class="status-footer-item dictionary-delete-progress" hidden>
             <div class="progress-labels"><div class="progress-info"></div><div class="progress-status"></div></div>
             <div class="progress-bar-track"><div class="progress-bar danger"></div></div>
@@ -2003,7 +2003,7 @@
                     </div>
                 </div>
                 <div class="settings-item-right">
-                    <a class="more-toggle more-only" data-parent-distance="3">Info&hellip;</a>
+                    <a tabindex="0" class="more-toggle more-only" data-parent-distance="3">Info&hellip;</a>
                 </div>
             </div>
             <div class="settings-item-children more" hidden>
@@ -2019,7 +2019,7 @@
                     If no conditions are specified, the profile will only be used if it is selected as the default profile.
                 </p>
                 <p>
-                    <a class="more-toggle" data-parent-distance="3">Hide&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Hide&hellip;</a>
                 </p>
             </div>
         </div>
@@ -2074,7 +2074,7 @@
     <div class="profile-entry-cell generic-list-index-prefix"></div>
     <div class="profile-entry-cell"><label class="radio"><input type="radio" class="profile-entry-is-default-radio" name="profile-entry-default-radio"><span class="radio-body"><span class="radio-border"></span><span class="radio-dot"></span></span></label></div>
     <div class="profile-entry-cell"><input class="profile-entry-name-input" type="text" autocomplete="off" placeholder="Profile name"></div>
-    <div class="profile-entry-cell"><a class="profile-entry-condition-count-link"><span class="profile-entry-condition-count">0</span></a></div>
+    <div class="profile-entry-cell"><a tabindex="0" class="profile-entry-condition-count-link"><span class="profile-entry-condition-count">0</span></a></div>
     <div class="profile-entry-cell input-height-icon-button-container"><button class="icon-button profile-entry-menu-button" data-menu="profile-menu" data-menu-position="below left"><span class="icon-button-inner"><span class="icon" data-icon="kebab-menu"></span></span></button></div>
 </div></template>
 
@@ -2137,7 +2137,7 @@
                 <div class="settings-item-left">
                     <div class="settings-item-label">
                         Enable support for prefix wildcard searches
-                        <a class="more-toggle more-only" data-parent-distance="4">(?)</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">(?)</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -2155,7 +2155,7 @@
                     they must be re-imported for the option to take effect.
                 </p>
                 <p>
-                    <a class="more-toggle" data-parent-distance="3">Hide&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Hide&hellip;</a>
                 </p>
             </div>
         </div>
@@ -2271,7 +2271,7 @@
                 <div class="settings-item-left">
                     <div class="settings-item-label">
                         Prefix wildcard searches supported
-                        <a class="more-toggle more-only" data-parent-distance="4">(?)</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">(?)</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -2282,7 +2282,7 @@
                 <p class="warning-text">
                     Changing this value requires the dictionary to be re-imported.
                 </p>
-                <p><a class="more-toggle" data-parent-distance="3">Hide&hellip;</a></p>
+                <p><a tabindex="0" class="more-toggle" data-parent-distance="3">Hide&hellip;</a></p>
             </div>
         </div>
         <div class="settings-item"><div class="settings-item-children">
@@ -2437,7 +2437,7 @@
                 <div class="settings-item-left">
                     <div class="settings-item-label">
                         Audio sources
-                        <a class="more-toggle more-only" data-parent-distance="4">(?)</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">(?)</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -2451,7 +2451,7 @@
                     first choice is not available.
                 </p>
                 <p>
-                    <a class="more-toggle" data-parent-distance="3">Less&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a>
                 </p>
             </div>
             <div class="settings-item-children">
@@ -2479,7 +2479,7 @@
         </p>
         <p>
             Example:<br>
-            <a data-select-on-click="">http://localhost/audio.mp3?term={term}&amp;reading={reading}</a>
+            <a tabindex="0" data-select-on-click="">http://localhost/audio.mp3?term={term}&amp;reading={reading}</a>
         </p>
     </div>
     <div class="modal-footer">
@@ -2498,7 +2498,7 @@
         </p>
         <p>
             Example:<br>
-            <a data-select-on-click="">http://localhost/audio.json?term={term}&amp;reading={reading}</a>
+            <a tabindex="0" data-select-on-click="">http://localhost/audio.json?term={term}&amp;reading={reading}</a>
         </p>
     </div>
     <div class="modal-footer">
@@ -2571,7 +2571,7 @@
         <div>
             <p>
                 Scanning inputs are used to define when text scanning should occur.
-                <a class="more-toggle more-only" data-parent-distance="2">More&hellip;</a>
+                <a tabindex="0" class="more-toggle more-only" data-parent-distance="2">More&hellip;</a>
             </p>
             <div class="margin-above more" hidden>
                 <p>
@@ -2598,7 +2598,7 @@
                         or use the <em>Clear inputs</em> menu option.
                     </li>
                 </ul>
-                <p><a class="more-toggle" data-parent-distance="3">Less&hellip;</a></p>
+                <p><a tabindex="0" class="more-toggle" data-parent-distance="3">Less&hellip;</a></p>
             </div>
         </div>
         <div class="scan-input-list generic-list margin-above" id="scan-input-list"></div>
@@ -2800,7 +2800,7 @@
             Anki card fields can be populated with information about a term or kanji character by using field markers.
             When a card is being generated, field markers are replaced with information about the term or kanji by using the installed dictionaries.
             Several preset markers are available, which are described below.
-            Markers can be customized by adjusting the <a data-modal-action="show,anki-card-templates">Anki card templates</a>.
+            Markers can be customized by adjusting the <a tabindex="0" data-modal-action="show,anki-card-templates">Anki card templates</a>.
         </p>
         <p>
             Anki requires the first field in a model to be unique for a card;
@@ -3304,17 +3304,17 @@
             </p>
 
             <ul data-show-for-browser="chrome">
-                <li>Open <a data-special-url="chrome://extensions/shortcuts">chrome://extensions/shortcuts</a> in a new tab.</li>
+                <li>Open <a tabindex="0" data-special-url="chrome://extensions/shortcuts">chrome://extensions/shortcuts</a> in a new tab.</li>
                 <li>Find the <em>Yomichan</em> section and configure the shortcuts.</li>
             </ul>
 
             <ul data-show-for-browser="edge">
-                <li>Open <a data-special-url="edge://extensions/shortcuts">edge://extensions/shortcuts</a> in a new tab.</li>
+                <li>Open <a tabindex="0" data-special-url="edge://extensions/shortcuts">edge://extensions/shortcuts</a> in a new tab.</li>
                 <li>Find the <em>Yomichan</em> section and configure the shortcuts.</li>
             </ul>
 
             <ul data-show-for-browser="firefox">
-                <li>Open the extensions page (<a data-select-on-click="">about:addons</a>)</li>
+                <li>Open the extensions page (<a tabindex="0" data-select-on-click="">about:addons</a>)</li>
                 <li>Click the button on the right with the gear icon, then click <em>Manage Extension Shortcuts</em>.</li>
                 <li>Find the <em>Yomichan</em> section and configure the shortcuts.</li>
             </ul>
diff --git a/ext/welcome.html b/ext/welcome.html
index 26ae513c..cbb4e4ad 100644
--- a/ext/welcome.html
+++ b/ext/welcome.html
@@ -186,7 +186,7 @@
 <!-- Auxiliary content -->
 <div class="status-footer-container" hidden><div class="status-footer-container2">
     <div class="status-footer">
-        <div class="status-footer-header"><div class="status-footer-header-label">Tasks in progress:</div><a class="status-footer-header-close">Close</a></div>
+        <div class="status-footer-header"><div class="status-footer-header-label">Tasks in progress:</div><a tabindex="0" class="status-footer-header-close">Close</a></div>
         <div class="status-footer-item dictionary-delete-progress" hidden>
             <div class="progress-labels"><div class="progress-info"></div><div class="progress-status"></div></div>
             <div class="progress-bar-track"><div class="progress-bar danger"></div></div>
@@ -218,7 +218,7 @@
                 <div class="settings-item-left">
                     <div class="settings-item-label">
                         Enable support for prefix wildcard searches
-                        <a class="more-toggle more-only" data-parent-distance="4">(?)</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">(?)</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -236,7 +236,7 @@
                     they must be re-imported for the option to take effect.
                 </p>
                 <p>
-                    <a class="more-toggle" data-parent-distance="3">Hide&hellip;</a>
+                    <a tabindex="0" class="more-toggle" data-parent-distance="3">Hide&hellip;</a>
                 </p>
             </div>
         </div>
@@ -311,7 +311,7 @@
                 <div class="settings-item-left">
                     <div class="settings-item-label">
                         Prefix wildcard searches supported
-                        <a class="more-toggle more-only" data-parent-distance="4">(?)</a>
+                        <a tabindex="0" class="more-toggle more-only" data-parent-distance="4">(?)</a>
                     </div>
                 </div>
                 <div class="settings-item-right">
@@ -322,7 +322,7 @@
                 <p class="warning-text">
                     Changing this value requires the dictionary to be re-imported.
                 </p>
-                <p><a class="more-toggle" data-parent-distance="3">Hide&hellip;</a></p>
+                <p><a tabindex="0" class="more-toggle" data-parent-distance="3">Hide&hellip;</a></p>
             </div>
         </div>
         <div class="settings-item"><div class="settings-item-children">