Fix toast container making ui unclickable

front/src/components/Queue.vue

@@ -391,21 +391,6 @@ const reorderTracks = async (from: number, to: number) => {
           @remove="removeTrack"
           @reorder="reorderTracks"
         />
-        <!-- <virtual-list
-          ref="list"
-          wrap-class="queue-sortable-container"
-          item-class="queue-sortable-item"
-          :data-key="'id'"
-          :data-sources="queueItems"
-          :data-component="QueueItem"
-          :estimate-size="50"
-          :extra-props="{
-            onPlay: play,
-            onRemove: removeTrack,
-            itemClass: (index: number) => currentIndex === index ? 'active': ''
-          }"
-          @reorder="log"
-        /> -->
         <div
           v-if="$store.state.radios.running"
           class="ui info message"

front/src/style/globals/_layout.scss

@@ -46,10 +46,19 @@
     padding-bottom: $bottom-player-height;
     .toast-container {
       bottom: $bottom-player-height + 1rem;
+      pointer-events: none;
     }
   }
 }
 
+.toast-container {
+  pointer-events: none;
+
+  > div {
+    pointer-events: auto;
+  }
+}
+
 #footer {
   border-bottom: none;
   border-top: 1px solid rgba(34, 36, 38, 0.15);