feat(a11y): make menu buttons in 'More' dropdown selectable with the keyboard (#2976)

Co-authored-by: userquin <userquin@gmail.com>
This commit is contained in:
jyn 2024-10-21 05:00:51 -04:00 committed by GitHub
parent ae1da4c3e8
commit dac42e062c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 52 additions and 8 deletions

View file

@ -71,6 +71,7 @@ async function removeUserNote() {
/>
</NuxtLink>
<CommonDropdownItem
is="button"
v-if="isShareSupported"
:text="$t('menu.share_account', [`@${account.acct}`])"
icon="i-ri:share-line"
@ -81,12 +82,14 @@ async function removeUserNote() {
<template v-if="currentUser">
<template v-if="!isSelf">
<CommonDropdownItem
is="button"
:text="$t('menu.mention_account', [`@${account.acct}`])"
icon="i-ri:at-line"
:command="command"
@click="mentionUser(account)"
/>
<CommonDropdownItem
is="button"
:text="$t('menu.direct_message_account', [`@${account.acct}`])"
icon="i-ri:message-3-line"
:command="command"
@ -94,6 +97,7 @@ async function removeUserNote() {
/>
<CommonDropdownItem
is="button"
v-if="!relationship?.showingReblogs"
icon="i-ri:repeat-line"
:text="$t('menu.show_reblogs', [`@${account.acct}`])"
@ -101,6 +105,7 @@ async function removeUserNote() {
@click="toggleReblogs()"
/>
<CommonDropdownItem
is="button"
v-else
:text="$t('menu.hide_reblogs', [`@${account.acct}`])"
icon="i-ri:repeat-line"
@ -109,6 +114,7 @@ async function removeUserNote() {
/>
<CommonDropdownItem
is="button"
v-if="!relationship?.note || relationship?.note?.length === 0"
:text="$t('menu.add_personal_note', [`@${account.acct}`])"
icon="i-ri-edit-2-line"
@ -116,6 +122,7 @@ async function removeUserNote() {
@click="addUserNote()"
/>
<CommonDropdownItem
is="button"
v-else
:text="$t('menu.remove_personal_note', [`@${account.acct}`])"
icon="i-ri-edit-2-line"
@ -124,6 +131,7 @@ async function removeUserNote() {
/>
<CommonDropdownItem
is="button"
v-if="!relationship?.muting"
:text="$t('menu.mute_account', [`@${account.acct}`])"
icon="i-ri:volume-mute-line"
@ -131,6 +139,7 @@ async function removeUserNote() {
@click="toggleMuteAccount (relationship!, account)"
/>
<CommonDropdownItem
is="button"
v-else
:text="$t('menu.unmute_account', [`@${account.acct}`])"
icon="i-ri:volume-up-fill"
@ -139,6 +148,7 @@ async function removeUserNote() {
/>
<CommonDropdownItem
is="button"
v-if="!relationship?.blocking"
:text="$t('menu.block_account', [`@${account.acct}`])"
icon="i-ri:forbid-2-line"
@ -146,6 +156,7 @@ async function removeUserNote() {
@click="toggleBlockAccount (relationship!, account)"
/>
<CommonDropdownItem
is="button"
v-else
:text="$t('menu.unblock_account', [`@${account.acct}`])"
icon="i-ri:checkbox-circle-line"
@ -155,6 +166,7 @@ async function removeUserNote() {
<template v-if="getServerName(account) !== currentServer">
<CommonDropdownItem
is="button"
v-if="!relationship?.domainBlocking"
:text="$t('menu.block_domain', [getServerName(account)])"
icon="i-ri:shut-down-line"
@ -162,6 +174,7 @@ async function removeUserNote() {
@click="toggleBlockDomain(relationship!, account)"
/>
<CommonDropdownItem
is="button"
v-else
:text="$t('menu.unblock_domain', [getServerName(account)])"
icon="i-ri:restart-line"
@ -171,6 +184,7 @@ async function removeUserNote() {
</template>
<CommonDropdownItem
is="button"
:text="$t('menu.report_account', [`@${account.acct}`])"
icon="i-ri:flag-2-line"
:command="command"