make albums on artist page reactive

+ show artist name on artist album component on album page
+ attach artist page link to artist card
+ use small artist page on album header
+ use album color on genre banner on album page

src/components/shared/ArtistCard.vue

@@ -1,17 +1,35 @@
 <template>
-  <div class="artist-card" :class="{ _is_on_sidebar: alt }">
-    <img class="artist-image circular" :src="imguri + artist.image" loading="lazy" />
-    <div class="artist-name t-center">
-      {{ artist.name }}
+  <RouterLink
+    :to="{
+      name: Routes.artist,
+      params: {
+        hash: artist.artisthash,
+      },
+    }"
+  >
+    <div
+      class="artist-card"
+      :class="{ _is_on_sidebar: alt }"
+      :style="{ backgroundColor: `${artist.colors[0]}` }"
+    >
+      <img
+        class="artist-image circular"
+        :src="imguri + artist.image"
+        loading="lazy"
+      />
+      <div class="artist-name t-center">
+        {{ artist.name }}
+      </div>
     </div>
-  </div>
+  </RouterLink>
 </template>
 
 <script setup lang="ts">
+import { Routes } from "@/composables/enums";
 import { Artist } from "@/interfaces";
 import { paths } from "../../config";
 
-const imguri = paths.images.artist;
+const imguri = paths.images.artist.large;
 
 defineProps<{
   artist: Artist;

src/components/shared/PlayBtnRect.vue

@@ -40,5 +40,6 @@ defineProps<{
   transition: all 0.5s ease-in-out;
   color: $white;
   background: $darkestblue !important;
+  border-radius: 2rem;
 }
 </style>