英文首页动态视频

src/pages/A1home2/index.tsx

@@ -21,7 +21,7 @@ function A1home() {
   const [baseFlag, setBaseFlag] = useState(false)
   // const [baseFlag2, setBaseFlag2] = useState(false)
 
-  // const moveImg = useRef<any>(null)
+  const moveImg = useRef<any>(null)
   const moveImg2 = useRef<any>(null)
 
   // 视频准备
@@ -39,29 +39,29 @@ function A1home() {
       } //有足够的数据可以播放了
     }
 
-    moveImg2.current = F_Video(`./myData/base.ts`, params)
-    const dom = document.querySelector(`.A1baseVideo2`)!
-    dom.append(moveImg2.current.domElement)
+    // moveImg2.current = F_Video(`./myData/base.ts`, params)
+    // const dom = document.querySelector(`.A1baseVideo2`)!
+    // dom.append(moveImg2.current.domElement)
 
     // (暂时中英文版本都只用一个)
-    // if (val === 'EN') {
-    //   moveImg.current = F_Video(`./myData/baseEn.ts`, params)
-    //   const dom = document.querySelector(`.A1baseVideo`)!
-    //   dom.append(moveImg.current.domElement)
-    // } else {
-    //   moveImg2.current = F_Video(`./myData/base.ts`, params)
-    //   const dom = document.querySelector(`.A1baseVideo2`)!
-    //   dom.append(moveImg2.current.domElement)
-    // }
+    if (val === 'EN') {
+      moveImg.current = F_Video(`./myData/baseEn.ts`, params)
+      const dom = document.querySelector(`.A1baseVideo`)!
+      dom.append(moveImg.current.domElement)
+    } else {
+      moveImg2.current = F_Video(`./myData/base.ts`, params)
+      const dom = document.querySelector(`.A1baseVideo2`)!
+      dom.append(moveImg2.current.domElement)
+    }
   }, [])
 
   useEffect(() => {
     if (baseImg) {
       // (暂时中英文版本都只用一个)
       // videoCanvasFu('EN')
-      videoCanvasFu('ZH')
+      videoCanvasFu(myLangue)
     }
-  }, [baseImg, videoCanvasFu])
+  }, [baseImg, videoCanvasFu, myLangue])
 
   const [loadOk, setLoadOk] = useState(false)
   const [progress, setProgress] = useState(0)
@@ -69,10 +69,10 @@ function A1home() {
   useEffect(() => {
     if (progress >= 100) {
       // 播放动态视频 (暂时中英文版本都只用一个)
-      // moveImg.current.play()
-      moveImg2.current.play()
+      if (myLangue === 'EN') moveImg.current.play()
+      else moveImg2.current.play()
     }
-  }, [progress])
+  }, [progress, myLangue])
 
   useEffect(() => {
     // (暂时中英文版本都只用一个)
@@ -119,10 +119,11 @@ function A1home() {
 
       <div className='loadingP' style={{ display: loadOk ? 'none' : 'flex' }}>
         {/* (暂时中英文版本都只用一个) */}
-        {/* <div
+        <div
           className='A1baseVideo'
           style={{ opacity: progress >= 100 ? 1 : 0, zIndex: myLangue === 'EN' ? 5 : 4 }}
-        ></div> */}
+        ></div>
+
         <div
           className='A1baseVideo2'
           style={{ opacity: progress >= 100 ? 1 : 0, zIndex: myLangue === 'ZH' ? 5 : 4 }}

src/pages/A2yblm/components/ModalTxt/index.module.scss

@@ -259,22 +259,22 @@
           &::-webkit-scrollbar {
             width: 0px;
           }
+          & > span {
+            & > img {
+              width: 15px;
+              height: 21px;
+              object-fit: contain;
+              transform: translate(-1px, -1px);
+            }
+          }
 
           & > a {
             color: black;
             position: relative;
-
-            &::after {
-              content: '';
-              position: absolute;
-              left: 0;
-              bottom: -4px;
-              width: 100%;
-              height: 2px;
-              background-color: rgba(208, 131, 63, 1);
-              transform: scaleX(0.95);
-              transform-origin: right center;
-            }
+            text-decoration: underline;
+            text-decoration-color: rgba(208, 131, 63, 1);
+            text-decoration-thickness: 2px;
+            text-underline-offset: 4px;
           }
 
           .translate {
@@ -355,18 +355,10 @@
             & > a {
               color: rgba(94, 52, 34, 1);
               position: relative;
-
-              &::after {
-                content: '';
-                position: absolute;
-                left: 0;
-                bottom: -2px;
-                width: 100%;
-                height: 2px;
-                background-color: rgba(166, 118, 67, 1);
-                transform: scaleX(0.95);
-                transform-origin: right center;
-              }
+              text-decoration: underline;
+              text-decoration-color: rgba(166, 118, 67, 1);
+              text-decoration-thickness: 2px;
+              text-underline-offset: 2px;
             }
           }
         }
@@ -584,18 +576,10 @@
           & > a {
             color: black;
             position: relative;
-
-            &::after {
-              content: '';
-              position: absolute;
-              left: 0;
-              bottom: -4px;
-              width: 100%;
-              height: 2px;
-              background-color: rgba(208, 131, 63, 1);
-              transform: scaleX(0.95);
-              transform-origin: right center;
-            }
+            text-decoration: underline;
+            text-decoration-color: rgba(208, 131, 63, 1);
+            text-decoration-thickness: 2px;
+            text-underline-offset: 4px;
           }
 
           .translate {
@@ -676,18 +660,10 @@
             & > a {
               color: rgba(94, 52, 34, 1);
               position: relative;
-
-              &::after {
-                content: '';
-                position: absolute;
-                left: 0;
-                bottom: -2px;
-                width: 100%;
-                height: 2px;
-                background-color: rgba(166, 118, 67, 1);
-                transform: scaleX(0.95);
-                transform-origin: right center;
-              }
+              text-decoration: underline;
+              text-decoration-color: rgba(166, 118, 67, 1);
+              text-decoration-thickness: 2px;
+              text-underline-offset: 2px;
             }
           }
         }