This commit is contained in:
Shiny Nematoda 2024-01-21 12:19:18 +00:00
parent 411e0848e8
commit d494641d39
3 changed files with 20 additions and 14 deletions

View file

@ -17,15 +17,11 @@ function home() {
} }
function set(page) { function set(page) {
if (page == 'home') { if (page == 'home') useRoute('/');
useRoute('/'); else useRoute(`/${page}/`);
} else {
useRoute(`/${page}/`); if (page == 'home' && nav.state.page == 'home') emit('explore');
}
if (page == 'home' && nav.state.page == 'home') {
emit('explore');
}
nav.state.page = page; nav.state.page = page;
} }
</script> </script>
@ -38,35 +34,40 @@ function set(page) {
<div class="wrap"> <div class="wrap">
<span <span
role="menuitem" role="link"
aria-label="Home"
tabindex="0" tabindex="0"
class="nav-ico bi bi-house clickable" class="nav-ico bi bi-house clickable"
:data-active="nav.state.page == 'home'" :data-active="nav.state.page == 'home'"
@click="set('home')" @click="set('home')"
@keydown.enter="set('home')"></span> @keydown.enter="set('home')"></span>
<span <span
role="menuitem" role="link"
aria-label="Explore"
tabindex="0" tabindex="0"
class="nav-ico bi bi-compass clickable" class="nav-ico bi bi-compass clickable"
:data-active="nav.state.page == 'explore'" :data-active="nav.state.page == 'explore'"
@click="set('explore')" @click="set('explore')"
@keydown.enter="set('explore')"></span> @keydown.enter="set('explore')"></span>
<span <span
role="menuitem" role="link"
aria-label="Charts"
tabindex="0" tabindex="0"
class="nav-ico bi bi-graph-up-arrow clickable" class="nav-ico bi bi-graph-up-arrow clickable"
:data-active="nav.state.page == 'charts'" :data-active="nav.state.page == 'charts'"
@click="set('charts')" @click="set('charts')"
@keydown.enter="set('charts')"></span> @keydown.enter="set('charts')"></span>
<span <span
role="menuitem" role="link"
aria-label="Library"
tabindex="0" tabindex="0"
class="nav-ico bi bi-collection clickable" class="nav-ico bi bi-collection clickable"
:data-active="nav.state.page == 'library'" :data-active="nav.state.page == 'library'"
@click="set('library')" @click="set('library')"
@keydown.enter="set('library')"></span> @keydown.enter="set('library')"></span>
<span <span
role="menuitem" role="link"
aria-label="Prefs"
tabindex="0" tabindex="0"
class="nav-ico bi bi-gear clickable" class="nav-ico bi bi-gear clickable"
:data-active="nav.state.page == 'prefs'" :data-active="nav.state.page == 'prefs'"

View file

@ -24,6 +24,7 @@ watch(
<template> <template>
<button <button
class="bi bi-search popup-wrap" class="bi bi-search popup-wrap"
aria-label="Search"
@mouseenter="nav.state.show = true" @mouseenter="nav.state.show = true"
@mouseleave="nav.state.show = false" @mouseleave="nav.state.show = false"
@keydown.enter="nav.show()"> @keydown.enter="nav.show()">

View file

@ -111,7 +111,11 @@ const openSong = el => {
tabindex="0" tabindex="0"
@click="openSong($event.target)" @click="openSong($event.target)"
@keydown.enter="openSong($event.target)"> @keydown.enter="openSong($event.target)">
<img class="pop-2 bg-img song-bg" loading="lazy" :src="art" alt /> <img
class="pop-2 bg-img song-bg"
:loading="index > 4 ? 'lazy' : 'eager'"
:src="art"
alt />
<span class="flex content"> <span class="flex content">
<h4> <h4>