mirrors/Hyperpipe
1
0
Fork 0
mirror of https://codeberg.org/Hyperpipe/Hyperpipe synced 2025-06-29 05:28:00 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Keyboard handlers and aria labels added

Browse source
This commit is contained in:
banaanihillo 2024-05-05 12:20:13 +03:00
parent 36ca23cc82
commit 7bf4852303
7 changed files with 95 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/components/Playlists.vue
View file

@ -44,6 +44,7 @@ onMounted(() => {
<button
class="bi bi-shuffle pl-btn"
title="shuffle queue"
:aria-label="t('playlist.shuffle_queue')"
@click="
() => {
data.state.urls = useShuffle(data.state.urls);
@ -53,6 +54,7 @@ onMounted(() => {
<button
class="bi bi-bookmark-plus pl-btn"
title="save queue"
:aria-label="t('playlist.save_queue')"
@click="
() => {
let urls = data.state.urls.map(i => ({
@ -67,13 +69,17 @@ onMounted(() => {
<button
class="bi bi-dash-lg pl-btn"
title="clear queue"
:aria-label="t('playlist.clear_queue')"
@click="data.state.urls = []"></button>
</div>
<div
v-for="plurl in data.state.urls"
class="pl-item"
:key="plurl.url"
@click="handleClick(plurl, $event)">
@click="handleClick(plurl, $event)"
tabindex="0"
@keydown.enter="handleClick(plurl, $event)"
:aria-label="`Play track: ${plurl.title}`">
<span
v-if="data.state.url == plurl.url"
class="bars-wrap"