修改样式

index.html

@@ -11,6 +11,8 @@
   <meta http-equiv="Cache-control" content="no-cache">
   <meta http-equiv="Cache" content="no-cache">
   <meta name="apple-mobile-web-app-capable" content="yes" />
+  <!-- 自动将HTTP请求升级成安全的HTTPS请求 -->
+  <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests" />
   <!-- 设置苹果工具栏颜色 -->
   <meta name="apple-mobile-web-app-status-bar-style" content="black" />
   <!-- 忽略页面中的数字识别为电话，忽略email识别 -->

src/components/card-preview/video-modal/index.module.less

@@ -24,16 +24,20 @@
       justify-content: space-between;
       color: #fff;
       padding: 4px 12px 4px;
-      font-size: 24px;
+      font-size: max(24px, 14Px);
       font-weight: 600;
       line-height: 33px;
       min-width: 150px;
 
       .line {
-        font-size: 12px;
+        font-size: 20px;
       }
 
       :global {
+        .plyr__time {
+          font-size: max(24px);
+        }
+
         .plyr__time+.plyr__time:before {
           content: '';
           margin-right: 0;

src/components/card-type/audio-player/index.module.less

@@ -2,7 +2,7 @@
   position: relative;
   height: 100%;
   width: 100%;
-  height: 170px;
+  // height: 170px;
 
   .cover {
     position: absolute;
@@ -14,7 +14,7 @@
     pointer-events: none;
     user-select: none;
     width: 100%;
-    height: 170px;
+    // height: 170px;
     background-color: #fff;
     border-radius: 14px 14px 0 0;
     overflow: hidden;

src/components/card-type/video-player/index.module.less

@@ -2,7 +2,7 @@
   position: relative;
   height: 100%;
   width: 100%;
-  height: 170px;
+  // height: 170px;
 
   .cover {
     position: absolute;
@@ -14,7 +14,7 @@
     pointer-events: none;
     user-select: none;
     width: 100%;
-    height: 170px;
+    // height: 170px;
     background-color: #fff;
     border-radius: 14px 14px 0 0;
     overflow: hidden;

src/views/content-information/content-music/detail.module.less

@@ -459,30 +459,33 @@
   padding-bottom: 22px;
 }
 
+.musicInfo {
+  flex-direction: row;
+}
+
 .musicImg {
   position: relative;
-  width: 120px;
-  height: 120px;
+  width: 100px;
+  height: 100px;
   border-radius: 2px;
   z-index: 9;
   margin-right: 54px;
   margin-left: 31px;
-  margin-bottom: 27px;
 
   .img {
     position: relative;
     z-index: 9;
-    width: 120px;
-    height: 120px;
+    width: 100px;
+    height: 100px;
     border-radius: 2px;
   }
 
   .panSection {
     position: absolute;
-    right: -52px;
-    top: 7px;
-    width: 112px;
-    height: 112px;
+    right: -44px;
+    top: 5px;
+    width: 95px;
+    height: 95px;
     z-index: 0;
     display: flex;
     align-items: center;
@@ -502,8 +505,8 @@
     position: absolute;
     left: 0;
     right: 0;
-    width: 112px;
-    height: 112px;
+    width: 95px;
+    height: 95px;
     z-index: 0;
   }
 
@@ -515,7 +518,7 @@
     z-index: 10;
     display: inline-block;
     width: 5px;
-    height: 120px;
+    height: 100px;
     background: linear-gradient(270deg, rgba(0, 0, 0, 0.18) 0%, rgba(255, 255, 255, 0) 100%);
   }
 
@@ -534,27 +537,33 @@
 }
 
 .info {
-  text-align: center;
+  text-align: left;
 }
 
 .musicInfo {
-  width: 500px;
+  // width: 500px;
 
   .name {
-    font-size: 18px;
+    font-size: max(21px, 15Px);
     font-weight: 600;
     color: #131415;
     line-height: 25px;
-    padding-bottom: 6px;
+    padding-bottom: 8px;
   }
 
   .c {
-    font-size: 13px;
+    font-size: max(13px, 12Px);
     color: #777777;
     line-height: 18px;
 
     span {
+      flex-shrink: 0;
+    }
+
+    &>div {
+      display: flex;
       margin-right: 20px;
+      max-width: 220px;
     }
   }
 }

src/views/content-information/content-music/detail.tsx

@@ -175,12 +175,24 @@ export default defineComponent({
                       <div class={styles.name}>{data.details.name}</div>
                       <div class={styles.c}>
                         {data.details.composers ? (
-                          <span>作曲：{data.details.composers}</span>
+                          <div>
+                            <span>作曲：</span>
+                            <TheNoticeBar
+                              text={data.details.composers}
+                              style={{ marginRight: '0' }}
+                            />
+                          </div>
                         ) : (
                           ''
                         )}
                         {data.details.lyricists ? (
-                          <span>作词：{data.details.lyricists}</span>
+                          <div>
+                            <span>作词：</span>
+                            <TheNoticeBar
+                              text={data.details.lyricists}
+                              style={{ marginRight: '0' }}
+                            />
+                          </div>
                         ) : (
                           ''
                         )}