bug fix

RandallAnjie · Jun 6, 2024 · 8b4a5dc · 8b4a5dc
1 parent f353316
commit 8b4a5dc
Show file tree

Hide file tree

Showing 3 changed files with 64 additions and 1 deletion.
diff --git a/components/FriendsMemo.vue b/components/FriendsMemo.vue
@@ -614,5 +614,35 @@ const gotouser = () => {
   border: 2px solid #66d9ef; /* 选中时浅蓝绿色边框 */
 }
 
+.aplayer-body {
+  max-width: 100%; /* 限制宽度不超过父容器 */
+  width: 100%; /* 自动调整宽度 */
+}
+
+.aplayer-pic{
+  z-index: 1;
+}
+
+.aplayer-music {
+  overflow: hidden;
+  display: inline-block;
+  align-items: center;
+  width: 100%;
+  position: absolute;
+  animation: scroll 8s linear infinite;
+}
+
+.aplayer-title, .aplayer-author {
+  padding-right: 10px;
+}
+
+@keyframes scroll {
+  from { transform: translateX(100%); }
+  to { transform: translateX(-100%); }
+}
+
+.aplayer-lrc {
+  margin-top: 25px !important; /* 调整歌词与播放器的间距 */
+}
 
 </style>
diff --git a/components/MemoInput.vue b/components/MemoInput.vue
@@ -845,4 +845,36 @@ img{
   visibility: visible;
   opacity: 1;
 }
+
+.aplayer-body {
+  max-width: 100%; /* 限制宽度不超过父容器 */
+  width: 100%; /* 自动调整宽度 */
+}
+
+.aplayer-pic{
+  z-index: 1;
+}
+
+.aplayer-music {
+  overflow: hidden;
+  display: inline-block;
+  align-items: center;
+  width: 100%;
+  position: absolute;
+  animation: scroll 8s linear infinite;
+}
+
+.aplayer-title, .aplayer-author {
+  padding-right: 10px;
+}
+
+@keyframes scroll {
+  from { transform: translateX(100%); }
+  to { transform: translateX(-100%); }
+}
+
+.aplayer-lrc {
+  margin-top: 25px !important; /* 调整歌词与播放器的间距 */
+}
+
 </style>
diff --git a/layouts/default.vue b/layouts/default.vue
@@ -16,7 +16,7 @@
 
             <DropdownMenuPortal>
               <DropdownMenuContent
-                  class="min-w-[150px] outline-none bg-white rounded-md p-[5px] shadow-[0px_10px_38px_-10px_rgba(22,_23,_24,_0.35),_0px_10px_20px_-15px_rgba(22,_23,_24,_0.2)] will-change-[opacity,transform] data-[side=top]:animate-slideDownAndFade data-[side=right]:animate-slideLeftAndFade data-[side=bottom]:animate-slideUpAndFade data-[side=left]:animate-slideRightAndFade"
+                  class="min-w-[150px] outline-none bg-white rounded-md p-[5px] shadow-[0px_10px_38px_-10px_rgba(22,_23,_24,_0.35),_0px_10px_20px_-15px_rgba(22,_23,_24,_0.2)] will-change-[opacity,transform] data-[side=top]:animate-slideDownAndFade data-[side=right]:animate-slideLeftAndFade data-[side=bottom]:animate-slideUpAndFade data-[side=left]:animate-slideRightAndFade z-10"
                   :side-offset="5"
               >
                 <DropdownMenuSeparator class="h-[1px] bg-green6 m-[5px]" />
@@ -242,6 +242,7 @@ div.tigger {
   bottom: 10px;
 }
 
+
 @media (min-width: 1024px) {
   div.tigger {
     width: calc((100vw - 480px)/2);