update hotMusicMore style

src/views/hot-music-more/index.module.less

@@ -13,6 +13,22 @@
       background-size: 100%;
     }
   }
+
+  .mSearch {
+    padding-top: 8px;
+    :global {
+      .van-search__content {
+        background: rgba(255,255,255,0.5) !important;
+        border: 1px solid #FFFFFF !important;
+      }
+      input::placeholder, .van-field__clear {
+        color: rgba(0, 0, 0, 0.40) !important;
+      }
+      input {
+        color: #333333 !important;
+      }
+    }
+  }
 }
 
 .woringHeader {
@@ -93,10 +109,18 @@
         background-size: contain;
         bottom: 16px;
       }
+      .van-tab {
+        font-size: 16px;
+      }
+      .van-tab--active {
+        font-size: 18px;
+      }
       .van-tab__text {
         line-height: normal;
         font-weight: 600;
+       
       }
+
       .van-tab--shrink {
         padding: 0 21px;
         z-index: 9;
@@ -151,7 +175,7 @@
 }
 
 .musicList {
-  margin: 8px 13px 13px;
+  margin: 2px 13px 13px;
   background: rgba(255,255,255,0.28);
   border-radius: 16px;
   border: 2px solid #FFFFFF;
@@ -235,7 +259,7 @@
         display: inline-block;
         width: 8px;
         height: 10px;
-        margin-right: 1px;
+        margin-right: 3px;
       }
     }
 

src/views/hot-music-more/index.tsx

@@ -440,6 +440,8 @@ export default defineComponent({
           <MSearch
             v-model:modelValue={searchValue.value}
             background={'transparent'}
+            inputBackground="transparent"
+            class={styles.mSearch}
             onSearch={(val: any) => {
               if (state.tabActive === 'RECOMMEND') {
                 state.recommendSearch.name = val;

src/views/hot-music-more/music-detail/index.module.less

@@ -55,6 +55,13 @@
       position: relative;
       text-align: center;
       padding: 25px 0 8px;
+      width: 185px;
+      margin: 0 auto;
+    }
+
+    .noticeBar {
+      padding: 0;
+      height: 28px;
       font-weight: 600;
       font-size: 18px;
       color: #131415;

src/views/hot-music-more/music-detail/index.tsx

@@ -18,7 +18,7 @@ import first from '../images/staff/first.png'
 import firstActive from '../images/staff/first-active.png'
 import fixed from '../images/staff/fixed.png'
 import fixedActive from '../images/staff/fixed-active.png'
-import { Button, Popover, showLoadingToast, showToast } from 'vant';
+import { Button, NoticeBar, Popover, showLoadingToast, showToast } from 'vant';
 import { state } from '@/state';
 import {
   getInstrumentName,
@@ -502,7 +502,11 @@ export default defineComponent({
                 opacity: !data.musicPdfUrl ? '1' : '0',
                 height: !data.musicPdfUrl ? 'auto' : '0'
               }}>
-              {item.value?.musicSheetName}
+                <NoticeBar
+                    text={item.value?.musicSheetName}
+                    class={styles.noticeBar}
+                    background="none"
+                  />
             </div>
             {data.iframeSrc &&
             (isEnsemble.value || data.musicPdfUrl || !isMusicImg.value) ? (