Browse Source

style: 课件样式修改

TIANYONG 1 year ago
parent
commit
f5244533ea

+ 3 - 1
src/views/courseware-play/component/instrument-info/index.module.less

@@ -91,7 +91,8 @@
                 }
             }      
             .songName {
-                font-size: 16px;
+                width: 100%;
+                font-size: 15px;
                 color: #131415;
                 font-weight: 500;
                 margin: 12px 0 4px;
@@ -99,6 +100,7 @@
             .songWords {
                 font-size: 12px;
                 color: #777777;
+                margin-bottom: 8px;
                 >span {
                     margin-right: 16px;
                 }

+ 10 - 2
src/views/courseware-play/component/instrument-info/index.tsx

@@ -5,8 +5,10 @@ import MEmpty from '@/components/m-empty';
 import styles from './index.module.less';
 import musicBg from '../../image/music_bg.png';
 import titleIcon1 from '../../image/title_icon1.png';
+import titleIcon2 from '../../image/title_icon2.png';
 import playIcon from '../../image/music_play_icon.png';
 import emptyIcon from '../../image/ins-empty-icon.png';
+import { NoticeBar } from 'vant';
 
 export default defineComponent({
   name: 'InstrumentInfo',
@@ -67,7 +69,13 @@ export default defineComponent({
                   <img src={forms.dataInfo.avatar || musicBg} />
                 </div>
               </div> 
-              <div class={styles.songName}>{forms.dataInfo.name || '--'}</div>   
+              {/* <div class={styles.songName}>{forms.dataInfo.name || '--'}</div>    */}
+              <NoticeBar
+                text={forms.dataInfo.name}
+                color="#000"
+                class={styles.songName}
+                background="none"
+              />
               <div class={styles.songWords}>
                 {forms.dataInfo.lyricists && (
                   <span>作词:{forms.dataInfo.lyricists}</span>
@@ -116,7 +124,7 @@ export default defineComponent({
           </div>
         </div>       
         <div class={styles.right}>
-          <div class={styles.title}><img class={styles.liBg} src={titleIcon1} />乐器简介</div>
+          <div class={styles.title}><img class={styles.liBg} src={ props.type === 'musician' ? titleIcon2 : titleIcon1 } />{props.type === 'wiki' ? '乐器简介' : props.type === 'instrument' ? '名曲故事' : props.type === 'musician' ? '个人简介' : ''}</div>
           <div class={styles.desc} v-html={forms.dataInfo.intros}></div>
           {!forms.loading && !forms.dataInfo.intros && (
             <MEmpty description="暂无内容" />

+ 6 - 2
src/views/courseware-play/component/point.module.less

@@ -45,7 +45,7 @@
   overflow: hidden;
 
   .cover {
-    height: 115px;
+    height: 108px;
     background: #fff;
     overflow: hidden;
 
@@ -76,7 +76,11 @@
       white-space: nowrap;
       flex-shrink: 0;
     }
-
+    .tName {
+      overflow-x: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
     :global {
       .van-icon {
         display: none;

+ 1 - 1
src/views/courseware-play/component/points.tsx

@@ -172,7 +172,7 @@ export default defineComponent({
                                           </div>
                                           <div class={styles.title}>
                                             <div class={styles.tag}>{types[material.type]}</div>
-                                            <div>{material.name}</div>
+                                            <div class={styles.tName}>{material.name}</div>
                                           </div>
                                         </div>
                                       );

BIN
src/views/courseware-play/image/title_icon2.png