fix scrolling in artist search page

src/components/AlbumView/Header.vue

@@ -2,7 +2,9 @@
   <div
     class="album-header-ambient rounded"
     style="height: 100%; width: 100%"
-    :style="{ boxShadow: album.colors ? `0 .5rem 2rem ${album.colors[0]}` : '' }"
+    :style="{
+      boxShadow: album.colors ? `0 .5rem 2rem ${album.colors[0]}` : '',
+    }"
   ></div>
   <div
     class="a-header rounded"
@@ -52,9 +54,12 @@
       </div>
       <div class="art" v-if="!albumHeaderSmall">
         <img
-          :src="imguri.artist + album.artistimg"
+          v-for="a in album.albumartists"
+          :src="imguri.artist + a.image"
           class="shadow-lg circular"
           loading="lazy"
+          :title="a.name"
+          :style="{ border: `solid 2px ${album.colors[0]}` }"
         />
       </div>
     </div>
@@ -76,7 +81,7 @@ import ArtistName from "@/components/shared/ArtistName.vue";
 
 import PlayBtnRect from "../shared/PlayBtnRect.vue";
 
-defineProps<{
+const props = defineProps<{
   album: AlbumInfo;
 }>();
 
@@ -151,8 +156,29 @@ useVisibility(albumheaderthing, handleVisibilityState);
     align-items: flex-end;
 
     .art {
-      display: flex;
+      display: inline-flex;
-      align-items: flex-end;
+      align-items: center;
+      flex-direction: row-reverse;
+      // background-color: red;
+
+      img {
+        height: 4rem;
+        background-color: $gray;
+        border: solid 2px $white;
+      }
+
+      img:last-child {
+        height: 4rem;
+        margin-top: 5px;
+      }
+
+      img:not(:last-child) {
+        margin-left: -2rem;
+      }
+
+      img:hover {
+        z-index: 10;
+      }
     }
 
     img {

src/composables/fetch/album.ts

@@ -71,7 +71,6 @@ const getAlbumsFromArtist = async (
   limit: number = 2,
   exclude: string
 ) => {
-  console.log(albumartists)
   const { data } = await useAxios({
     url: albumsByArtistUrl,
     props: {

src/stores/queue.ts

@@ -52,7 +52,7 @@ export default defineStore("Queue", {
       }
 
       const track = this.tracklist[index];
-      const uri = `${paths.api.files}/${track.id}-${track.trackhash}`;
+      const uri = `${paths.api.files}/${track.trackhash}`;
 
       new Promise((resolve, reject) => {
         audio.autoplay = true;

src/utils/usePutCommas.ts

@@ -4,7 +4,7 @@
  * @returns a string with commas in between each artist
  */
 export default (artists: string[]) => {
-  let result = [];
+  let result: string[] = [];
 
   artists.forEach((i, index, artists) => {
     if (index !== artists.length - 1) {

src/views/SearchView/artists.vue

@@ -13,7 +13,4 @@ import ArtistCard from "@/components/shared/ArtistCard.vue";
 import useSearchStore from "@/stores/search";
 
 const search = useSearchStore();
-</script>
+</script>
-
-<style lang="scss">
-</style>

src/views/SearchView/main.vue

@@ -180,6 +180,7 @@ onMounted(() => {
     gap: 1.75rem 0;
 
     padding-bottom: 4rem;
+    overflow: auto;
   }
 
   button.load-more {