第三单元

src/pages/A2yblm/index.module.scss

@@ -39,7 +39,7 @@
       .tab_active {
         background: url(../../assets/sgImg/ComponentAc.png) no-repeat center center;
         background-size: 100% 100%;
-        color: #7C4B36;
+        color: #7c4b36;
       }
     }
 
@@ -53,7 +53,7 @@
       width: 70px;
       height: 70px;
 
-      &>img {
+      & > img {
         height: 100%;
         object-fit: contain;
       }
@@ -79,7 +79,7 @@
         width: 28px;
         height: 100%;
 
-        &>img {
+        & > img {
           height: 100%;
           object-fit: contain;
         }
@@ -127,7 +127,7 @@
           height: 80px;
           cursor: pointer;
 
-          &>img {
+          & > img {
             height: 100%;
             object-fit: contain;
           }
@@ -135,7 +135,6 @@
       }
 
       .content {
-
         font-size: 16px;
         line-height: 24px;
         letter-spacing: 3px;
@@ -143,8 +142,13 @@
         text-align: justify;
         padding-top: 40px;
         color: rgba(255, 255, 255, 1);
+        overflow: auto;
+        &::-webkit-scrollbar {
+          width: 0px;
+          height: 0px;
+        }
 
-        &>p {
+        & > p {
           padding-bottom: 15px;
         }
       }
@@ -261,7 +265,7 @@
             font-size: 10px;
           }
 
-          &>img {
+          & > img {
             width: 100%;
             height: 100%;
             object-fit: contain;
@@ -275,23 +279,24 @@
         width: 100%;
         padding: 0 10px;
         overflow-y: auto;
-        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%);
+        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%
+        );
 
         &::-webkit-scrollbar {
           width: 0px;
         }
 
-        &>div {
+        & > div {
           text-align: justify;
           width: 100%;
           height: 100%;
@@ -333,10 +338,10 @@
         }
       }
 
-      .content>div {
+      .content > div {
         letter-spacing: 0;
         text-align: start;
       }
     }
   }
-}
+}

src/pages/A6ybwx/Sangzang/components/Sangzangys/index.tsx

@@ -275,7 +275,7 @@ function Sangzangys({ setShowTab }: { setShowTab: (tab: number) => void }) {
           <div
             className='mtext'
             style={{
-              ...(mzwCurrentIndex === 0 && {
+              ...((mzwCurrentIndex === 0 || mzwCurrentIndex === 1) && {
                 lineHeight: '34px',
                 textAlign: 'center'
               })

src/pages/A7wjwj/conponents/Discover/index.module.scss

@@ -7,7 +7,6 @@
   position: relative;
 
   :global {
-
     .left,
     .left2 {
       width: 45%;
@@ -33,12 +32,14 @@
 
         .text {
           font-size: 9px;
+          max-height: 71px;
+          overflow: auto;
         }
 
         .btn {
           text-align: right;
           font-size: 9px;
-          line-height: 9px;
+          line-height: 14px;
           color: rgba(255, 223, 174, 1);
           cursor: pointer;
         }
@@ -71,7 +72,7 @@
             height: 12px;
             line-height: 10px;
 
-            &>img {
+            & > img {
               height: 100%;
               object-fit: contain;
             }
@@ -101,7 +102,7 @@
         flex-direction: row;
 
         .text {
-          height: 8px;
+          height: 22px;
         }
       }
 
@@ -128,7 +129,7 @@
         left: 50%;
         transform: translate(-50%, -50%);
 
-        &>img {
+        & > img {
           height: 100%;
           object-fit: contain;
         }
@@ -167,7 +168,6 @@
         background: url('../../../../assets/img/A7_map1.png') no-repeat center bottom;
         background-size: contain;
         transition: all 0.8s;
-
       }
 
       .leftImgMove {
@@ -234,7 +234,7 @@
         justify-content: center;
         font-size: 12px;
 
-        &>img {
+        & > img {
           position: absolute;
           z-index: -1;
           height: 100%;
@@ -294,7 +294,7 @@
             object-fit: contain;
             line-height: 14px;
 
-            &>img {
+            & > img {
               height: 100%;
               object-fit: contain;
             }
@@ -349,7 +349,7 @@
       bottom: 2%;
       cursor: pointer;
 
-      &>img {
+      & > img {
         height: 100%;
         object-fit: contain;
       }
@@ -379,8 +379,6 @@
           margin-top: 8px;
           font-size: 16px;
           line-height: 22px;
-
-
         }
 
         .from {
@@ -428,11 +426,9 @@
           }
         }
       }
-
     }
 
     .left2 {
-
       .record5 {
         padding-top: 2px;
         width: 156px;
@@ -446,16 +442,14 @@
         .btn {
           font-size: 14px;
         }
-
       }
 
       .record3 {
-        width: 170px;
+        width: 181px;
         height: 60px;
         transform: translate(16.5%, -63%);
         padding-top: 2px;
 
-
         .text {
           font-size: 14px;
         }
@@ -463,15 +457,13 @@
         .btn {
           font-size: 14px;
         }
-
       }
 
       .record4 {
         width: 192px;
         height: 36px;
         transform: translate(-89.5%, 186%);
-        padding-top: 6px;
-
+        padding-top: 16px;
 
         .text {
           font-size: 14px;
@@ -480,7 +472,6 @@
         .btn {
           font-size: 14px;
         }
-
       }
 
       .back {
@@ -500,4 +491,4 @@
       height: 80px;
     }
   }
-}
+}

src/pages/A7wjwj/conponents/Discover/index.tsx

@@ -7,7 +7,7 @@ import { RootState } from '@/store'
 import { delUnityFu } from '@/pages/A0base/data'
 
 function Discover(props: { style?: React.CSSProperties }) {
-  const { myData } = useSelector((state: RootState) => state.A0Layout)
+  const { myData, myLangue } = useSelector((state: RootState) => state.A0Layout)
 
   // 将隐藏的页面打开，全景图->诗歌->大场景
   const lookScene = useCallback(() => {
@@ -53,17 +53,17 @@ function Discover(props: { style?: React.CSSProperties }) {
               // setIsShowRecord(false)
             }}
           >
-            查看流转轨迹
+            {myLangue === 'EN' ? 'View the flow track' : '查看流转轨迹'}
           </div>
         </div>
         <div className='record record2' style={{ opacity: move ? 0 : 1 }}>
-          <div className='text'>清光绪年间（1879-1892） 长治市上党区东呈村</div>
+          <div className='text' dangerouslySetInnerHTML={{ __html: myData.discover.txt2Items[0].title }}></div>
           <div className='btnContainer'>
             <div className='icon'>
               <img src={require('@/assets/img/A7_rotate.png')} alt='' />
             </div>
             <div className='btn' onClick={() => lookScene()}>
-              场景漫游
+              {myLangue === 'EN' ? 'Scene roaming' : '场景漫游'}
             </div>
           </div>
         </div>
@@ -100,7 +100,7 @@ function Discover(props: { style?: React.CSSProperties }) {
           }}
         >
           <img src={require('@/assets/img/A7_discover_back.png')} alt='' />
-          <div className='txt'>返回</div>
+          <div className='txt'>{myLangue === 'EN' ? 'Back' : '返回'}</div>
         </div>
       </div>
       <div className='right'>

src/pages/A7wjwj/conponents/Shuxing/index.module.scss

@@ -24,6 +24,7 @@
         line-height: 22px;
         letter-spacing: 2px;
         height: 90px;
+        max-height: 95px;
         overflow-y: auto;
       }
 
@@ -37,7 +38,7 @@
 
         .item {
           width: 24%;
-          height: 220px;
+          height: 245px;
           background-size: contain;
           display: flex;
           flex-direction: column;
@@ -55,7 +56,7 @@
             display: flex;
             align-items: center;
 
-            &>img {
+            & > img {
               width: 100%;
               height: 80%;
               object-fit: contain;
@@ -66,12 +67,18 @@
             font-size: 18px;
             font-weight: 600;
             color: rgba(91, 71, 46, 1);
+            white-space: nowrap;
           }
 
           .time {
             font-size: 14px;
             font-weight: 400;
             color: #a59a8a;
+            overflow: auto;
+            &::-webkit-scrollbar {
+              width: 0;
+              height: 0;
+            }
           }
         }
       }
@@ -96,7 +103,7 @@
         gap: 10px;
 
         .left {
-          width: 52%;
+          width: 63%;
           height: 100%;
           display: flex;
           flex-direction: column;
@@ -104,14 +111,13 @@
           color: rgba(93, 96, 96, 1);
           font-size: 10px;
 
-          &>div {
+          & > div {
             display: flex;
             align-items: flex-start;
             position: relative;
             font-size: 16px;
             text-align: justify;
             margin: 3px 0;
-
           }
 
           .detailTitle {
@@ -122,7 +128,6 @@
             font-weight: 700;
             color: rgb(124, 75, 54);
 
-
             &::after {
               background: none;
             }
@@ -149,6 +154,15 @@
               box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5);
             }
           }
+
+          p {
+            max-height: 95px;
+            overflow: auto;
+            &::-webkit-scrollbar {
+              width: 0;
+              height: 0;
+            }
+          }
         }
 
         .right {
@@ -157,7 +171,7 @@
           align-self: flex-start;
           position: relative;
 
-          &>img {
+          & > img {
             width: 80%;
             height: 100%;
             object-fit: contain;
@@ -201,7 +215,7 @@
             background-image: url('../../../../assets/sgImg/img_txtac.png');
           }
 
-          &>img {
+          & > img {
             width: 80%;
             height: 80%;
             object-fit: contain;
@@ -210,4 +224,4 @@
       }
     }
   }
-}
+}

src/pages/A7wjwj/index.tsx

@@ -12,7 +12,7 @@ import { isUnitySta, lodingUnityFu } from '../A0base/data'
 import Zloding from '@/components/Zloding'
 
 function A7Wjwj() {
-  const { myData, unityKey } = useSelector((state: RootState) => state.A0Layout)
+  const { myData, unityKey, myLangue } = useSelector((state: RootState) => state.A0Layout)
 
   const [currentTab, setCurrentTab] = useState(0)
 
@@ -69,19 +69,19 @@ function A7Wjwj() {
           className={`tab songFont ${currentTab === 0 ? 'active' : ''}`}
           onClick={() => setCurrentTab(0)}
         >
-          发现之谜
+          {myLangue === 'EN' ? 'Discover' : '发现之谜'}
         </div>
         <div
           className={`tab songFont ${currentTab === 1 ? 'active' : ''}`}
           onClick={() => setCurrentTab(1)}
         >
-          属性之辨
+          {myLangue === 'EN' ? 'Distinction' : '属性之辨'}
         </div>
         <div
           className={`tab songFont ${currentTab === 2 ? 'active' : ''}`}
           onClick={() => setCurrentTab(2)}
         >
-          未解之思
+          {myLangue === 'EN' ? 'Unresolved' : '未解之思'}
         </div>
       </div>
 

src/types/declaration.d.ts

@@ -35,6 +35,7 @@ type MyDataType = {
   // 发现之谜
   discover: {
     txt1Items: { title: string }[]
+    txt2Items: { title: string }[]
     search: { title: string; txt: string; from: string }[]
   }
   // 属性之辨