From 524363267811ce34ab82786ccf392ceb2708ac16 Mon Sep 17 00:00:00 2001
From: tusooa <tusooa@kazv.moe>
Date: Sat, 21 Jan 2023 15:08:17 -0500
Subject: [PATCH 1/2] Label buttons in top bar

---
 src/components/desktop_nav/desktop_nav.vue | 7 ++++---
 src/components/search_bar/search_bar.vue   | 4 ++++
 src/i18n/en.json                           | 1 +
 3 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/components/desktop_nav/desktop_nav.vue b/src/components/desktop_nav/desktop_nav.vue
index 07bf8005..e0ee39c3 100644
--- a/src/components/desktop_nav/desktop_nav.vue
+++ b/src/components/desktop_nav/desktop_nav.vue
@@ -20,6 +20,7 @@
         class="logo"
         :to="{ name: 'root' }"
         :style="logoBgStyle"
+        :title="sitename"
       >
         <div
           class="mask"
@@ -38,13 +39,13 @@
         />
         <button
           class="button-unstyled nav-icon"
+          :title="$t('nav.preferences')"
           @click.stop="openSettingsModal"
         >
           <FAIcon
             fixed-width
             class="fa-scale-110 fa-old-padding"
             icon="cog"
-            :title="$t('nav.preferences')"
           />
         </button>
         <a
@@ -52,26 +53,26 @@
           href="/pleroma/admin/#/login-pleroma"
           class="nav-icon"
           target="_blank"
+          :title="$t('nav.administration')"
           @click.stop
         >
           <FAIcon
             fixed-width
             class="fa-scale-110 fa-old-padding"
             icon="tachometer-alt"
-            :title="$t('nav.administration')"
           />
         </a>
         <span class="spacer" />
         <button
           v-if="currentUser"
           class="button-unstyled nav-icon"
+          :title="$t('login.logout')"
           @click.stop.prevent="logout"
         >
           <FAIcon
             fixed-width
             class="fa-scale-110 fa-old-padding"
             icon="sign-out-alt"
-            :title="$t('login.logout')"
           />
         </button>
       </div>
diff --git a/src/components/search_bar/search_bar.vue b/src/components/search_bar/search_bar.vue
index 3969d8de..9da2b272 100644
--- a/src/components/search_bar/search_bar.vue
+++ b/src/components/search_bar/search_bar.vue
@@ -8,6 +8,7 @@
       class="button-unstyled nav-icon"
       :title="$t('nav.search')"
       type="button"
+      :aria-expanded="!hidden"
       @click.prevent.stop="toggleHidden"
     >
       <FAIcon
@@ -29,6 +30,7 @@
       <button
         class="button-default search-button"
         type="submit"
+        :title="$t('nav.search')"
         @click="find(searchTerm)"
       >
         <FAIcon
@@ -39,6 +41,8 @@
       <button
         class="button-unstyled cancel-search"
         type="button"
+        :title="$t('nav.search_close')"
+        :aria-expanded="!hidden"
         @click.prevent.stop="toggleHidden"
       >
         <FAIcon
diff --git a/src/i18n/en.json b/src/i18n/en.json
index 1ee1147a..5b97bdcd 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -172,6 +172,7 @@
     "bookmarks": "Bookmarks",
     "user_search": "User Search",
     "search": "Search",
+    "search_close": "Close search bar",
     "who_to_follow": "Who to follow",
     "preferences": "Preferences",
     "timelines": "Timelines",

From 1ab958ba6b0ad1e1449fd8fe6b0bc8729520ce12 Mon Sep 17 00:00:00 2001
From: tusooa <tusooa@kazv.moe>
Date: Sat, 21 Jan 2023 15:30:23 -0500
Subject: [PATCH 2/2] Make quick settings menus more accessible

---
 .../quick_filter_settings.vue                 | 29 ++++++++-
 .../quick_view_settings.vue                   | 65 +++++++++++++------
 2 files changed, 73 insertions(+), 21 deletions(-)

diff --git a/src/components/quick_filter_settings/quick_filter_settings.vue b/src/components/quick_filter_settings/quick_filter_settings.vue
index f2aa61ee..b81215a1 100644
--- a/src/components/quick_filter_settings/quick_filter_settings.vue
+++ b/src/components/quick_filter_settings/quick_filter_settings.vue
@@ -6,36 +6,51 @@
     :trigger-attrs="{ title: $t('timeline.quick_filter_settings') }"
   >
     <template #content>
-      <div class="dropdown-menu">
-        <div v-if="loggedIn">
+      <div
+        class="dropdown-menu"
+        role="menu"
+      >
+        <div
+          v-if="loggedIn"
+          role="group"
+        >
           <button
             v-if="!conversation"
             class="button-default dropdown-item"
+            :aria-checked="replyVisibilityAll"
+            role="menuitemradio"
             @click="replyVisibilityAll = true"
           >
             <span
               class="menu-checkbox -radio"
               :class="{ 'menu-checkbox-checked': replyVisibilityAll }"
+              :aria-hidden="true"
             />{{ $t('settings.reply_visibility_all') }}
           </button>
           <button
             v-if="!conversation"
             class="button-default dropdown-item"
+            :aria-checked="replyVisibilityFollowing"
+            role="menuitemradio"
             @click="replyVisibilityFollowing = true"
           >
             <span
               class="menu-checkbox -radio"
               :class="{ 'menu-checkbox-checked': replyVisibilityFollowing }"
+              :aria-hidden="true"
             />{{ $t('settings.reply_visibility_following_short') }}
           </button>
           <button
             v-if="!conversation"
             class="button-default dropdown-item"
+            :aria-checked="replyVisibilitySelf"
+            role="menuitemradio"
             @click="replyVisibilitySelf = true"
           >
             <span
               class="menu-checkbox -radio"
               :class="{ 'menu-checkbox-checked': replyVisibilitySelf }"
+              :aria-hidden="true"
             />{{ $t('settings.reply_visibility_self_short') }}
           </button>
           <div
@@ -46,33 +61,43 @@
         </div>
         <button
           class="button-default dropdown-item"
+          role="menuitemcheckbox"
+          :aria-checked="muteBotStatuses"
           @click="muteBotStatuses = !muteBotStatuses"
         >
           <span
             class="menu-checkbox"
             :class="{ 'menu-checkbox-checked': muteBotStatuses }"
+            :aria-hidden="true"
           />{{ $t('settings.mute_bot_posts') }}
         </button>
         <button
           class="button-default dropdown-item"
+          role="menuitemcheckbox"
+          :aria-checked="hideMedia"
           @click="hideMedia = !hideMedia"
         >
           <span
             class="menu-checkbox"
             :class="{ 'menu-checkbox-checked': hideMedia }"
+            :aria-hidden="true"
           />{{ $t('settings.hide_media_previews') }}
         </button>
         <button
           class="button-default dropdown-item"
+          role="menuitemcheckbox"
+          :aria-checked="hideMutedPosts"
           @click="hideMutedPosts = !hideMutedPosts"
         >
           <span
             class="menu-checkbox"
             :class="{ 'menu-checkbox-checked': hideMutedPosts }"
+            :aria-hidden="true"
           />{{ $t('settings.hide_all_muted_posts') }}
         </button>
         <button
           class="button-default dropdown-item dropdown-item-icon"
+          role="menuitem"
           @click="openTab('filtering')"
         >
           <FAIcon icon="font" />{{ $t('settings.word_filter_and_more') }}
diff --git a/src/components/quick_view_settings/quick_view_settings.vue b/src/components/quick_view_settings/quick_view_settings.vue
index 4bd81c5b..9f5cdabc 100644
--- a/src/components/quick_view_settings/quick_view_settings.vue
+++ b/src/components/quick_view_settings/quick_view_settings.vue
@@ -6,60 +6,87 @@
     :trigger-attrs="{ title: $t('timeline.quick_view_settings') }"
   >
     <template #content>
-      <div class="dropdown-menu">
-        <button
-          class="button-default dropdown-item"
-          @click="conversationDisplay = 'tree'"
-        >
-          <span
-            class="menu-checkbox -radio"
-            :class="{ 'menu-checkbox-checked': conversationDisplay === 'tree' }"
-          /><FAIcon icon="folder-tree" /> {{ $t('settings.conversation_display_tree_quick') }}
-        </button>
-        <button
-          class="button-default dropdown-item"
-          @click="conversationDisplay = 'linear'"
-        >
-          <span
-            class="menu-checkbox -radio"
-            :class="{ 'menu-checkbox-checked': conversationDisplay === 'linear' }"
-          /><FAIcon icon="list" /> {{ $t('settings.conversation_display_linear_quick') }}
-        </button>
+      <div
+        class="dropdown-menu"
+        role="menu"
+      >
+        <div role="group">
+          <button
+            class="button-default dropdown-item"
+            :aria-checked="conversationDisplay === 'tree'"
+            role="menuitemradio"
+            @click="conversationDisplay = 'tree'"
+          >
+            <span
+              class="menu-checkbox -radio"
+              :aria-hidden="true"
+              :class="{ 'menu-checkbox-checked': conversationDisplay === 'tree' }"
+            /><FAIcon
+              icon="folder-tree"
+              :aria-hidden="true"
+            /> {{ $t('settings.conversation_display_tree_quick') }}
+          </button>
+          <button
+            class="button-default dropdown-item"
+            :aria-checked="conversationDisplay === 'linear'"
+            role="menuitemradio"
+            @click="conversationDisplay = 'linear'"
+          >
+            <span
+              class="menu-checkbox -radio"
+              :class="{ 'menu-checkbox-checked': conversationDisplay === 'linear' }"
+              :aria-hidden="true"
+            /><FAIcon
+              icon="list"
+              :aria-hidden="true"
+            /> {{ $t('settings.conversation_display_linear_quick') }}
+          </button>
+        </div>
         <div
           role="separator"
           class="dropdown-divider"
         />
         <button
           class="button-default dropdown-item"
+          role="menuitemcheckbox"
+          :aria-checked="showUserAvatars"
           @click="showUserAvatars = !showUserAvatars"
         >
           <span
             class="menu-checkbox"
             :class="{ 'menu-checkbox-checked': showUserAvatars }"
+            :aria-hidden="true"
           />{{ $t('settings.mention_link_show_avatar_quick') }}
         </button>
         <button
           v-if="!conversation"
           class="button-default dropdown-item"
+          role="menuitemcheckbox"
+          :aria-checked="autoUpdate"
           @click="autoUpdate = !autoUpdate"
         >
           <span
             class="menu-checkbox"
             :class="{ 'menu-checkbox-checked': autoUpdate }"
+            :aria-hidden="true"
           />{{ $t('settings.auto_update') }}
         </button>
         <button
           v-if="!conversation"
           class="button-default dropdown-item"
+          role="menuitemcheckbox"
+          :aria-checked="collapseWithSubjects"
           @click="collapseWithSubjects = !collapseWithSubjects"
         >
           <span
             class="menu-checkbox"
             :class="{ 'menu-checkbox-checked': collapseWithSubjects }"
+            :aria-hidden="true"
           />{{ $t('settings.collapse_subject') }}
         </button>
         <button
           class="button-default dropdown-item dropdown-item-icon"
+          role="menuitem"
           @click="openTab('general')"
         >
           <FAIcon icon="wrench" />{{ $t('settings.more_settings') }}