Browse Source

英文模式下字的颜色调整

natasha 2 years ago
parent
commit
3ea17c83bf

+ 10 - 10
src/components/Adult/preview/ArticleViewChs/NormalModelChs.vue

@@ -1380,7 +1380,7 @@ export default {
             font-weight: normal;
             font-size: 14px;
             line-height: 20px;
-            color: rgba(0, 0, 0, 0.45);
+            color: rgba(0, 0, 0, 1);
             height: 20px;
             &.noFont {
               font-family: initial;
@@ -1389,19 +1389,19 @@ export default {
               text-align: left;
             }
             &.wordBlank {
-              color: rgba(0, 0, 0, 0.85);
+              color: rgba(0, 0, 0, 1);
             }
           }
           &.NNPE-chs {
             font-family: "FZJCGFKTK";
             font-size: 20px;
             line-height: 28px;
-            color: rgba(0, 0, 0, 0.45);
+            color: rgba(0, 0, 0, 1);
             .active {
               color: #de4444;
             }
             &.wordBlank {
-              color: rgba(0, 0, 0, 0.85);
+              color: rgba(0, 0, 0, 1);
             }
           }
           // &.padding {
@@ -1425,7 +1425,7 @@ export default {
           font-weight: normal;
           font-size: 14px;
           line-height: 20px;
-          color: rgba(0, 0, 0, 0.45);
+          color: rgba(0, 0, 0, 1);
           height: 20px;
           &.noFont {
             font-family: initial;
@@ -1434,19 +1434,19 @@ export default {
             text-align: left;
           }
           &.wordBlank {
-            color: rgba(0, 0, 0, 0.85);
+            color: rgba(0, 0, 0, 1);
           }
         }
         &.NNPE-chs {
           font-family: "FZJCGFKTK";
           font-size: 20px;
           line-height: 28px;
-          color: rgba(0, 0, 0, 0.45);
+          color: rgba(0, 0, 0, 1);
           .active {
             color: #de4444;
           }
           &.wordBlank {
-            color: rgba(0, 0, 0, 0.85);
+            color: rgba(0, 0, 0, 1);
           }
         }
         &.padding {
@@ -1460,11 +1460,11 @@ export default {
     font-weight: normal;
     font-size: 14px;
     line-height: 22px;
-    color: rgba(0, 0, 0, 0.45);
+    color: rgba(0, 0, 0, 1);
     padding-left: 3px;
     word-break: break-word;
     &.wordBlank {
-      color: rgba(0, 0, 0, 0.85);
+      color: rgba(0, 0, 0, 1);
     }
   }
 }

+ 10 - 10
src/components/Adult/preview/ArticleViewChs/PhraseModelChs.vue

@@ -1260,7 +1260,7 @@ export default {
             font-weight: normal;
             font-size: 14px;
             line-height: 20px;
-            color: rgba(0, 0, 0, 0.85);
+            color: rgba(0, 0, 0, 0.65);
             height: 20px;
             &.noFont {
               font-family: initial;
@@ -1269,19 +1269,19 @@ export default {
               text-align: left;
             }
             &.wordBlank {
-              color: rgba(0, 0, 0, 0.85);
+              color: rgba(0, 0, 0, 0.65);
             }
           }
           &.NNPE-chs {
             font-family: "FZJCGFKTK";
             font-size: 20px;
             line-height: 28px;
-            color: rgba(0, 0, 0, 0.85);
+            color: rgba(0, 0, 0, 0.65);
             &.active {
               color: #de4444;
             }
             &.wordBlank {
-              color: rgba(0, 0, 0, 0.85);
+              color: rgba(0, 0, 0, 0.65);
             }
           }
           // &.padding {
@@ -1305,7 +1305,7 @@ export default {
           font-weight: normal;
           font-size: 14px;
           line-height: 20px;
-          color: rgba(0, 0, 0, 0.85);
+          color: rgba(0, 0, 0, 0.65);
           height: 20px;
           &.noFont {
             font-family: initial;
@@ -1314,19 +1314,19 @@ export default {
             text-align: left;
           }
           &.wordBlank {
-            color: rgba(0, 0, 0, 0.85);
+            color: rgba(0, 0, 0, 0.65);
           }
         }
         &.NNPE-chs {
           font-family: "FZJCGFKTK";
           font-size: 20px;
           line-height: 28px;
-          color: rgba(0, 0, 0, 0.85);
+          color: rgba(0, 0, 0, 0.65);
           &.active {
             color: #de4444;
           }
           &.wordBlank {
-            color: rgba(0, 0, 0, 0.85);
+            color: rgba(0, 0, 0, 0.65);
           }
         }
         &.padding {
@@ -1340,11 +1340,11 @@ export default {
     font-weight: normal;
     font-size: 14px;
     line-height: 22px;
-    color: rgba(0, 0, 0, 0.85);
+    color: rgba(0, 0, 0, 0.65);
     padding-left: 3px;
     word-break: break-word;
     &.wordBlank {
-      color: rgba(0, 0, 0, 0.85);
+      color: rgba(0, 0, 0, 0.65);
     }
   }
 }

+ 32 - 3
src/components/Adult/preview/ArticleViewChs/WordModelChs.vue

@@ -255,7 +255,7 @@
             <!--  -->
             <div class="NPC-sentences-list">
                 <div
-                :class="['NNPE-detail-box']"
+                :class="['NNPE-detail-box', sentIndex == index ? 'active' : '']"
                 v-for="(item, index) in resObj.sentList"
                 :key="'detail' + index"
                 >
@@ -636,6 +636,17 @@ export default {
     },
     getCurTime(curTime) {
       this.curTime = curTime * 1000;
+      this.getSentIndex(this.curTime);
+    },
+    getSentIndex(curTime) {
+      for (let i = 0; i < this.curQue.wordTime.length; i++) {
+        let bg = this.curQue.wordTime[i].bg;
+        let ed = this.curQue.wordTime[i].ed;
+        if (curTime >= bg && curTime <= ed) {
+          this.sentIndex = i;
+          break;
+        }
+      }
     },
     handleData() {
       let resArr = [];
@@ -971,7 +982,7 @@ export default {
             font-size: 20px;
             line-height: 28px;
             &.active {
-              background: rgba(60, 200, 99, 0.2);
+              background: rgba(36, 185, 158, 0.15);
             }
             // &.wordActive {
             //   color: #de4444;
@@ -1011,7 +1022,7 @@ export default {
           font-size: 20px;
           line-height: 28px;
           &.active {
-            background: rgba(60, 200, 99, 0.2);
+            background: rgba(36, 185, 158, 0.15);
           }
         //   &.wordActive {
         //     color: #de4444;
@@ -1176,4 +1187,22 @@ export default {
       color: rgba(0, 0, 0, 0.85);
     }
   }
+  .NPC-Big-Book-preview-green {
+  .NNPE-ArticleView {
+    .NNPE-detail-box {
+      &.active {
+        background: rgba(36, 185, 158, 0.15);
+      }
+    }
+  }
+}
+.NPC-Big-Book-preview-brown {
+  .NNPE-ArticleView {
+    .NNPE-detail-box {
+      &.active {
+        background: rgba(189, 136, 101, 0.15);
+      }
+    }
+  }
+}
 </style>