فهرست منبع

英文版样式参考

lanxin 2 روز پیش
والد
کامیت
538450a786

+ 6 - 2
public/index.html

@@ -1,5 +1,5 @@
-<!DOCTYPE html>
-<html lang="zh">
+<!doctype html>
+<html lang="en">
   <head>
     <meta charset="utf-8" />
     <meta
@@ -20,6 +20,10 @@
         font-family: 'song';
         src: url('./myData/song.OTF');
       }
+      @font-face {
+        font-family: 'heiti';
+        src: url('./myData/heiti.OTF');
+      }
 
       .fontLoding {
         position: absolute;

BIN
public/myData/heiti.OTF


تفاوت فایلی نمایش داده نمی شود زیرا این فایل بسیار بزرگ است
+ 291 - 270
public/myData/myDataEN.js


BIN
src/assets/img/A6_ffhy_bg_E.jpg


BIN
src/assets/img/A6_ffhy_btn1_E.png


BIN
src/assets/img/A6_ffhy_btn2_E.png


+ 5 - 1
src/assets/styles/base.css

@@ -4,7 +4,7 @@
   box-sizing: border-box;
   word-wrap: break-word;
   -webkit-tap-highlight-color: transparent;
-  font-family: 'SimHei', 'SimSun', 'Microsoft Yahei', 'PingFang SC', 'Avenir', 'Segoe UI', 'Hiragino Sans GB', 'STHeiti', 'Microsoft Sans Serif', 'WenQuanYi Micro Hei', sans-serif;
+  font-family: heiti;
 }
 video {
   object-fit: fill;
@@ -29,6 +29,7 @@ body {
   color: black;
   overflow: hidden;
   background-color: #cbc5b7;
+  font-family: heitiFont;
 }
 body #wjwjScene {
   width: 100%;
@@ -547,6 +548,9 @@ textarea {
   font-family: 'song' !important;
   font-weight: 700 !important;
 }
+.heitiFont {
+  font-family: 'heiti';
+}
 #Weijie {
   animation: Weijie 3s linear forwards;
 }

+ 6 - 2
src/assets/styles/base.less

@@ -4,8 +4,7 @@
   box-sizing: border-box;
   word-wrap: break-word;
   -webkit-tap-highlight-color: transparent;
-  font-family: 'SimHei', 'SimSun', 'Microsoft Yahei', 'PingFang SC', 'Avenir', 'Segoe UI', 'Hiragino Sans GB',
-    'STHeiti', 'Microsoft Sans Serif', 'WenQuanYi Micro Hei', sans-serif;
+  font-family: heiti;
 }
 
 video {
@@ -36,6 +35,7 @@ body {
   overflow: hidden;
   background-color: #cbc5b7;
   // background-color: rgba(0, 0, 0, 0.8);
+  font-family: heitiFont;
 }
 
 body #wjwjScene {
@@ -718,6 +718,10 @@ textarea {
   font-weight: 700 !important;
 }
 
+.heitiFont {
+  font-family: 'heiti';
+}
+
 // 未解之思页面动画效果
 #Weijie {
   animation: Weijie 3s linear forwards;

+ 16 - 7
src/pages/A0base/index.module.scss

@@ -158,7 +158,9 @@
         flex-direction: column;
         gap: 8px;
         color: rgba(255, 233, 182, 1);
-        transition: height 0.4s ease-in-out, opacity 0.3s ease-in-out;
+        transition:
+          height 0.4s ease-in-out,
+          opacity 0.3s ease-in-out;
         overflow: hidden;
         opacity: 0;
         padding-top: 10px;
@@ -269,7 +271,7 @@
         .title {
           display: flex;
           align-items: center;
-          height: 32px;
+          height: 45px;
           font-size: 16px;
           width: auto;
           max-width: 90%;
@@ -278,12 +280,19 @@
 
         .text {
           position: relative;
-          height: calc(100% - 60px);
+          width: 80%;
+          height: calc(100% - 70px);
           overflow: auto;
-          letter-spacing: 0px;
-          line-height: 16px;
-          text-align: left;
-          font-size: 12px;
+          letter-spacing: -0.5px;
+          line-height: 25px;
+          word-spacing: -0.2em;
+          text-align: justify;
+          text-align-last: left;
+          -webkit-hyphens: auto;
+          hyphens: auto;
+          word-break: break-word;
+          font-size: 14px;
+          // text-align: left;
 
           &::-webkit-scrollbar {
             width: 0px;

+ 4 - 1
src/pages/A2yblm/components/ModalTxt/index.module.scss

@@ -516,7 +516,10 @@
         .intro_txt {
           max-height: 200px;
           line-height: 21px;
-          text-align: left;
+          text-align: justify;
+          text-align-last: left;
+          hyphens: auto;
+          word-break: break-word;
         }
 
         .intro_btn {

+ 41 - 11
src/pages/A2yblm/components/Shufa/index.module.scss

@@ -451,10 +451,12 @@
     .shufa1 {
       .sLeft {
         .leftTxt1 {
-          width: 85%;
-          text-align: left;
-          font-size: 9px;
-          line-height: 10px;
+          width: 74%;
+          text-align: justify;
+          word-spacing: 0;
+          hyphens: auto;
+          font-size: 10px;
+          line-height: 14px;
           height: 82px;
           overflow: auto;
           padding-bottom: 10px;
@@ -479,8 +481,12 @@
 
       .sRight {
         .rightTitle1 {
+          width: 86%;
           font-size: 11px;
-          line-height: 15px;
+          line-height: 18px;
+          text-align: justify;
+          word-spacing: 1px;
+          margin-top: 0;
         }
 
         .rightTitleLine1 {
@@ -492,8 +498,9 @@
         }
 
         .rightIntro {
-          margin-top: 4px;
-          width: 91%;
+          margin-top: 12px;
+          margin-bottom: 12px;
+          width: 87%;
           height: 33%;
           background: none;
 
@@ -514,6 +521,8 @@
               height: 100%;
               font-size: 11px;
               line-height: 13px;
+              text-align: justify;
+              word-spacing: -0.02em;
               & > span {
                 font-weight: 600;
                 color: rgba(175, 135, 100, 1);
@@ -531,11 +540,32 @@
         }
 
         .rightTxt1 {
-          font-size: 9px;
+          font-size: 10px;
           margin-top: 6px;
-          width: 91%;
-          text-align: left;
-          line-height: 10px;
+          width: 87%;
+          height: 65px;
+          text-align: justify;
+          word-spacing: 0;
+          hyphens: auto;
+          line-height: 14px;
+          overflow: auto;
+          padding-bottom: 10px;
+          &::-webkit-scrollbar {
+            width: 0px;
+            height: 0px;
+          }
+          mask-image: linear-gradient(
+            to bottom,
+            rgba(0, 0, 0, 1) 0%,
+            rgba(0, 0, 0, 1) 80%,
+            /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */
+          );
+          -webkit-mask-image: linear-gradient(
+            to bottom,
+            rgba(0, 0, 0, 1) 0%,
+            rgba(0, 0, 0, 1) 80%,
+            rgba(0, 0, 0, 0) 100%
+          );
         }
 
         .shufa1Btn {

+ 1 - 1
src/pages/A6ybwx/Genealogy/index.tsx

@@ -13,7 +13,7 @@ function Genealogy({ setGotoTab }: { setGotoTab: (tab: number) => void }) {
 
   const [gestureState1, setGestureState1] = useState('')
 
-  const { myData } = useSelector((state: RootState) => state.A0Layout)
+  const { myData, myLangue } = useSelector((state: RootState) => state.A0Layout)
 
   useEffect(() => {
     let timer: NodeJS.Timeout

+ 40 - 0
src/pages/A6ybwx/StatueArt/index.module.scss

@@ -114,3 +114,43 @@
     }
   }
 }
+
+// --------------英文版
+.StatueArtEn {
+  background-position: center center;
+  background-repeat: no-repeat;
+  background-image: url('../../../assets/img/A6_ffhy_bg_E.jpg');
+  background-size: 100% 100%;
+  :global {
+    .Stext {
+      width: 387px;
+      height: 45%;
+      font-size: 14px;
+      letter-spacing: -0.5px;
+      line-height: 24px;
+      color: rgb(91, 71, 46);
+      font-weight: 300;
+      transform: translate(17%, 73%);
+      text-align: justify;
+      word-spacing: -1px;
+      overflow: auto;
+      padding-bottom: 10px;
+      &::-webkit-scrollbar {
+        width: 0px;
+        height: 0px;
+      }
+      mask-image: linear-gradient(
+        to bottom,
+        rgba(0, 0, 0, 1) 0%,
+        rgba(0, 0, 0, 1) 80%,
+        /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */
+      );
+      -webkit-mask-image: linear-gradient(
+        to bottom,
+        rgba(0, 0, 0, 1) 0%,
+        rgba(0, 0, 0, 1) 80%,
+        rgba(0, 0, 0, 0) 100%
+      );
+    }
+  }
+}

تفاوت فایلی نمایش داده نمی شود زیرا این فایل بسیار بزرگ است
+ 7 - 6
src/pages/A6ybwx/StatueArt/index.tsx