add bottom padding to v-scroll-page class instead of individual pages

+ Rewrite queue page with  @Akryum/vue-virtual-scroller

src/components/RightSideBar/Queue.vue

@@ -2,7 +2,6 @@
   <QueueActions />
   <div
     class="queue-virtual-scroller"
-    style="height: 100%"
     @mouseover="mouseover = true"
     @mouseout="mouseover = false"
   >
@@ -39,8 +38,8 @@ const mouseover = ref(false);
 
 const scrollerItems = computed(() => {
   return queue.tracklist.map((track) => ({
+    track,
     id: Math.random(),
-    track: track,
   }));
 });
 

src/components/shared/SongItem.vue

@@ -100,8 +100,6 @@ function showMenu(e: Event) {
 </script>
 
 <style lang="scss">
-
-
 .songlist-item {
   display: grid;
   grid-template-columns: 1.5rem 2fr 1fr 1.5fr 2.5rem 2.5rem;
@@ -233,4 +231,8 @@ function showMenu(e: Event) {
     border-radius: 0 $small $small 0;
   }
 }
+
+.songlist-item.current {
+  background-color: $gray;
+}
 </style>