tesses50
/
freetube
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Remove deprecated @keypress + some accessability improvements (#2697) 

* remove deprecated @keypress from top-nav

* remove deprecated @keypress from side-nav

* add role and tabindex to new window button

it could previously not be selected by tabbing over the buttons
This commit is contained in:
Aiz 2022-10-12 17:02:39 +00:00 committed by GitHub
parent b35d7ea5e7
commit 1695605ab5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 16 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/renderer/components/side-nav/side-nav.vue
View File

@ -38,6 +38,7 @@
tabindex="0" tabindex="0"
:title="$t('Channels.Channels')" :title="$t('Channels.Channels')"
@click="navigate('subscribedchannels')" @click="navigate('subscribedchannels')"
@keydown.enter.prevent="navigate('subscribedchannels')"
> >
<div <div
class="thumbnailContainer" class="thumbnailContainer"
@ -63,7 +64,7 @@
tabindex="0" tabindex="0"
:title="$t('Trending.Trending')" :title="$t('Trending.Trending')"
@click="navigate('trending')" @click="navigate('trending')"
@keypress="navigate('trending')" @keydown.enter.prevent="navigate('trending')"
> >
<div <div
class="thumbnailContainer" class="thumbnailContainer"
@ -89,7 +90,7 @@
tabindex="0" tabindex="0"
:title="$t('Most Popular')" :title="$t('Most Popular')"
@click="navigate('popular')" @click="navigate('popular')"
@keypress="navigate('popular')" @keydown.enter.prevent="navigate('popular')"
> >
<div <div
class="thumbnailContainer" class="thumbnailContainer"
@ -115,7 +116,7 @@
tabindex="0" tabindex="0"
:title="$t('Playlists')" :title="$t('Playlists')"
@click="navigate('userplaylists')" @click="navigate('userplaylists')"
@keypress="navigate('userplaylists')" @keydown.enter.prevent="navigate('userplaylists')"
> >
<div <div
class="thumbnailContainer" class="thumbnailContainer"
@ -143,7 +144,7 @@
tabindex="0" tabindex="0"
:title="$t('History.History')" :title="$t('History.History')"
@click="navigate('history')" @click="navigate('history')"
@keypress="navigate('history')" @keydown.enter.prevent="navigate('history')"
> >
<div <div
class="thumbnailContainer" class="thumbnailContainer"
@ -169,7 +170,7 @@
tabindex="0" tabindex="0"
:title="$t('Settings.Settings')" :title="$t('Settings.Settings')"
@click="navigate('settings')" @click="navigate('settings')"
@keypress="navigate('settings')" @keydown.enter.prevent="navigate('settings')"
> >
<div <div
class="thumbnailContainer" class="thumbnailContainer"
@ -194,7 +195,7 @@
tabindex="0" tabindex="0"
:title="$t('About.About')" :title="$t('About.About')"
@click="navigate('about')" @click="navigate('about')"
@keypress="navigate('about')" @keydown.enter.prevent="navigate('about')"
> >
<div <div
class="thumbnailContainer" class="thumbnailContainer"
@ -224,7 +225,7 @@
:title="channel.name" :title="channel.name"
role="button" role="button"
tabindex="0" tabindex="0"
@keypress="goToChannel(channel.id)" @keydown.enter.prevent="goToChannel(channel.id)"
@click="goToChannel(channel.id)" @click="goToChannel(channel.id)"
> >
<router-link <router-link

13
src/renderer/components/top-nav/top-nav.vue
View File

@ -10,7 +10,7 @@
role="button" role="button"
tabindex="0" tabindex="0"
@click="toggleSideNav" @click="toggleSideNav"
@keypress="toggleSideNav" @keydown.enter.prevent="toggleSideNav"
/> />
<font-awesome-icon <font-awesome-icon
ref="historyArrowBack" ref="historyArrowBack"
@ -20,7 +20,7 @@
tabindex="0" tabindex="0"
:title="backwardText" :title="backwardText"
@click="historyBack" @click="historyBack"
@keypress="historyBack" @keydown.enter.prevent="historyBack"
/> />
<font-awesome-icon <font-awesome-icon
ref="historyArrowForward" ref="historyArrowForward"
@ -30,7 +30,7 @@
tabindex="0" tabindex="0"
:title="forwardText" :title="forwardText"
@click="historyForward" @click="historyForward"
@keypress="historyForward" @keydown.enter.prevent="historyForward"
/> />
<font-awesome-icon <font-awesome-icon
v-if="!hideSearchBar" v-if="!hideSearchBar"
@ -39,13 +39,16 @@
role="button" role="button"
tabindex="0" tabindex="0"
@click="toggleSearchContainer" @click="toggleSearchContainer"
@keypress="toggleSearchContainer" @keydown.enter.prevent="toggleSearchContainer"
/> />
<font-awesome-icon <font-awesome-icon
class="navNewWindowIcon navIcon" class="navNewWindowIcon navIcon"
:icon="['fas', 'clone']" :icon="['fas', 'clone']"
:title="newWindowText" :title="newWindowText"
role="button"
tabindex="0"
@click="createNewWindow" @click="createNewWindow"
@keydown.enter.prevent="createNewWindow"
/> />
<div <div
class="logo" class="logo"
@ -90,7 +93,7 @@
role="button" role="button"
tabindex="0" tabindex="0"
@click="showFilters = !showFilters" @click="showFilters = !showFilters"
@keypress="showFilters = !showFilters" @keydown.enter.prevent="showFilters = !showFilters"
/> />
</div> </div>
<ft-search-filters <ft-search-filters