add "go to artist" and "go to album artist" context options

+ refactor api endpoints to point to / for production

src/components/ArtistView/Header.vue

@@ -16,7 +16,7 @@
       }"
     >
       <section class="text">
-        <div class="card-title">ARTIST</div>
+        <div class="card-title">Artist</div>
         <div class="artist-name">{{ artist.info.name }}</div>
         <div class="stats">
           {{ artist.info.trackcount }} Track{{

src/components/LeftSidebar/Navigation.vue

@@ -76,8 +76,6 @@ const menus = [
 .side-nav-container {
   text-transform: capitalize;
   margin-top: 1rem;
-  // background-color: rgba(255, 255, 255, 0.075);
-  // padding: $small;
 
   .nav-button {
     border-radius: $medium;

src/components/LeftSidebar/Playlists.vue

@@ -1,53 +0,0 @@
-<template>
-  <div class="sidebar-playlists">
-    <div class="header">your playlists</div>
-    <div class="list rounded">
-      <div v-for="p in pStore.playlists" class="ellip">
-        <router-link
-          :to="{
-            name: 'PlaylistView',
-            params: {
-              pid: p.id,
-            },
-          }"
-        >
-          {{ p.name }}
-        </router-link>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import usePStore from "@/stores/pages/playlists";
-import { onMounted } from "vue";
-const pStore = usePStore();
-
-onMounted(() => {
-  if (pStore.playlists.length == 0) {
-    pStore.fetchAll();
-  }
-});
-</script>
-
-<style lang="scss">
-.sidebar-playlists {
-  display: grid;
-  grid-template-rows: max-content 1fr;
-
-  .header {
-    opacity: 0.5;
-    margin-bottom: $small;
-    margin-left: 1rem;
-    font-size: small;
-  }
-
-  .list {
-    padding: $small;
-
-    & > * {
-      padding: $small;
-    }
-  }
-}
-</style>

src/components/shared/SongItem.vue

@@ -226,6 +226,7 @@ async function addToFav(trackhash: string) {
       align-content: center;
       transition: all 0.2s;
       transform: translateX(-1.5rem);
+      color: red;
     }
   }