From a98fcb43d6e842fd6b9cb9bd41cbfbe52242124f Mon Sep 17 00:00:00 2001
From: alger <algerkc@qq.com>
Date: Fri, 13 Sep 2024 09:08:57 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9E=20fix:=20=E4=BF=AE=E5=A4=8D?=
 =?UTF-8?q?=E6=92=AD=E6=94=BE=E5=88=97=E8=A1=A8=E6=97=A0=E6=B3=95=E6=98=BE?=
 =?UTF-8?q?=E7=A4=BA=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layout/components/PlayBar.vue | 19 +++++++++++++------
 1 file changed, 13 insertions(+), 6 deletions(-)

diff --git a/src/layout/components/PlayBar.vue b/src/layout/components/PlayBar.vue
index 0720eb6..3ff6cd7 100644
--- a/src/layout/components/PlayBar.vue
+++ b/src/layout/components/PlayBar.vue
@@ -79,10 +79,12 @@
         </template>
         <div class="music-play-list">
           <div class="music-play-list-back"></div>
-          <n-virtual-list :item-size="75" item-resizable>
-            <div class="music-play-list-content">
-              <song-item v-for="item in playList" :key="item.id" :item="item" mini></song-item>
-            </div>
+          <n-virtual-list :item-size="57" item-resizable :items="playList">
+            <template #default="{ item }">
+              <div class="music-play-list-content">
+                <song-item :key="item.id" :item="item" mini></song-item>
+              </div>
+            </template>
           </n-virtual-list>
         </div>
       </n-popover>
@@ -304,13 +306,14 @@ const setMusicFull = () => {
 .music-play {
   &-list {
     height: 50vh;
-    @apply relative rounded-3xl overflow-hidden;
+    width: 300px;
+    @apply relative rounded-3xl overflow-hidden py-2;
     &-back {
       backdrop-filter: blur(20px);
       @apply absolute top-0 left-0 w-full h-full bg-gray-800 bg-opacity-75;
     }
     &-content {
-      padding: 10px;
+      @apply mx-2;
     }
   }
 }
@@ -346,4 +349,8 @@ const setMusicFull = () => {
     flex: 1;
   }
 }
+
+:deep(.n-popover) {
+  box-shadow: none;
+}
 </style>