update(Player): styles

src/components/AudioPlayer/Player.tsx

@@ -214,7 +214,7 @@ export default function AudioPlayer({
           {/* 播放进度 */}
           <div className="flex items-end justify-between h-fit mt-6px gap-6px">
             {/* 播放时长 */}
-            <span className="block w-27px text-10px leading-14px text-center text-#000">
+            <span className="block w-27px text-11px leading-14px text-center text-#000">
               {secondToDate(trackProgress)}
             </span>
 
@@ -226,7 +226,7 @@ export default function AudioPlayer({
             />
 
             {/* 总时长 */}
-            <span className="block w-27px text-10px leading-14px text-center text-#000">
+            <span className="block w-27px text-11px leading-14px text-center text-#000">
               {secondToDate(duration || 0)}
             </span>
           </div>

src/components/AudioPlayer/widget/VolumeBar.tsx

@@ -16,7 +16,9 @@ export default function Volumne({
   };
 
   return (
-    <div className={`relative flex items-center w-18px h-118px bg-#fff ${styles.VolumeBarContainer} ${className}`}>
+    <div
+      className={`relative flex items-center w-18px h-118px rounded-18px bg-#fff ${styles.VolumeBarContainer} ${className}`}
+    >
       <SliderPrimitive.Root
         value={[value]}
         orientation="vertical"

src/components/AudioPlayer/widget/index.module.css

@@ -14,13 +14,15 @@
   background-color: rgba(0, 0, 0, 0.1);
   position: relative;
   flex-grow: 1;
-  height: 3px;
+  height: 2px;
+  border-radius: 2px;
+  overflow: hidden;
 }
 
 .ProgressBarRange {
   position: absolute;
   background-color: #181818;
-  height: 3px;
+  height: 2px;
 }
 
 .ProgressBarThumb {
@@ -42,6 +44,7 @@
   align-items: center;
   position: relative;
 }
+
 .VolumeBarRoot[data-orientation='vertical'] {
   flex-direction: column;
   height: 102px;
@@ -56,6 +59,7 @@
 
 .VolumeBarTrack[data-orientation='vertical'] {
   width: 2px;
+  border-radius: 2px;
 }
 
 /* 激活区域 */
@@ -65,6 +69,7 @@
 }
 .VolumeBarRange[data-orientation='vertical'] {
   width: 100%;
+  border-radius: 2px;
 }
 
 /* 滑块 */
@@ -85,6 +90,11 @@
   background-color: rgba(0, 0, 0, 0.95);
 }
 
+.VolumeBarContainer {
+  box-shadow: 0px 6px 34px rgba(0, 0, 0, 0.1);
+  /* overflow: hidden; */
+}
+
 .VolumeBarContainer::before {
   content: '';
   display: block;
@@ -97,6 +107,7 @@
   box-shadow: 0 0 0 0.7px #e1e1e1; /* 使用阴影模拟边框 */
   transform: scale(0.5);
   pointer-events: none; /** 防止 userCard 点击事件失效 */
+  overflow: hidden;
 }
 
 .SongList::-webkit-scrollbar {

src/components/Header/index.module.css

@@ -8,7 +8,7 @@
   position: absolute;
   left: calc(-50% - 0.7px);
   top: calc(-50% - 0.7px);
-  border-radius: 24px;
+  border-radius: 18px;
   width: calc(200% + 1.4px); /* 考虑到阴影会占用额外空间，增加 1.4px */
   height: calc(200% + 1.4px); /* 考虑到阴影会占用额外空间，增加 1.4px */
   box-shadow: 0 0 0 0.7px #e1e1e1; /* 使用阴影模拟边框 */