gx

.vscode/settings.json

@@ -1,4 +1,6 @@
 {
   "editor.defaultFormatter": "esbenp.prettier-vscode",
-  "editor.formatOnSave": true
-}
+  "editor.formatOnSave": true,
+  "trae.tab.enableRename": false,
+  "trae.tab.enableAutoImport": false
+}

public/myData/myData.js

@@ -1126,7 +1126,8 @@ const myDataTemp = {
           title: '云冈石窟<br/>高浮雕佛像',
           fromTxt: '图片来源：《云冈石窟全集》卷2 第5窟P299'
         }
-      ]
+      ],
+      foxiangUrl: `myData/img/A6_zxys_gfd.png`
     },
     {
       customN: ' (字庆云)',
@@ -1146,7 +1147,8 @@ const myDataTemp = {
           title: '北魏洛阳石棺<br/>闵子骞孝行图',
           fromTxt: '图片来源：《中国画像石棺全集》P475'
         }
-      ]
+      ],
+      foxiangUrl: `myData/img/A6_zxys_yxk.png`
     },
     {
       customN: ' (字庆云)',
@@ -1160,7 +1162,8 @@ const myDataTemp = {
           title: '南朝<br/>竹林七贤与荣启期',
           fromTxt: '图片来源：南京博物院 官方微信公众号'
         }
-      ]
+      ],
+      foxiangUrl: `myData/img/A6_zxys_gyr.png`
     },
     {
       customN: ' (字庆云)',
@@ -1175,7 +1178,8 @@ const myDataTemp = {
           title: '克孜尔石窟飞天',
           fromTxt: '图片来源：郑州博物院微信公众号 克孜尔石窟飞天'
         }
-      ]
+      ],
+      foxiangUrl: `myData/img/A6_zxys_hfsz.png`
     }
   ],
   // 家族谱系
@@ -1961,7 +1965,7 @@ const myDataTemp = {
   sangzangLeftInfo: [
     {
       pic: './img/A6_sangzang_tab1.png',
-      from: '图片来源 《文物》 1963年第6期P50',
+      from: '图片来源《文物》1963年第6期P50',
       name: '柳子辉墓志',
       time: '北齐天保七年（556年）'
     },
@@ -1981,7 +1985,7 @@ const myDataTemp = {
     },
     {
       src: './myData/img/A6_sangzang_yp2.png',
-      from: '图片来源<br/>《山西博物院藏品概览 石造像卷》P62',
+      from: '图片来源《山西博物院藏品概览 石造像卷》P62',
       name: '北齐天保十年发愿文',
       txt: '超度亡父母、祈求功德'
     }
@@ -2047,7 +2051,7 @@ const myDataTemp = {
         },
         {
           name: '景君碑',
-          time: '东汉汉安二年（143年）至本初元年（146年）',
+          time: '东汉汉安二年（143年）<br/>至本初元年（146年）',
           desc: '《景君碑》是最早形制较为完整的一方汉碑，有额、有碑穿、有座，高288厘米，宽105.6厘米。额篆“汉故益州太守北海相景君铭”碑文记载景君生平功绩，颂其治行德政，反映东汉士人价值取向与地方治理理念。',
           img: ['./myData/knowlegeImg/bjzcyczb-lhzj-jjb-1.png'],
           from: '图片来源：济宁市博物馆微信公众号',
@@ -2142,7 +2146,7 @@ const myDataTemp = {
       part2: [
         {
           name: '刘贤墓志',
-          time: '北魏文成帝拓跋濬时期（452-465年）',
+          time: '北魏文成帝拓跋濬时期<br/>（452-465年）',
           desc: '',
           img: [
             './myData/knowlegeImg/bjzcyczb-bc-lxmz-3.png',

src/assets/styles/base.css

@@ -92,6 +92,7 @@ body #A7Back > img {
   font-size: 14px;
   color: #fff;
   margin-top: 10px;
+  white-space: nowrap;
 }
 #root {
   overflow: hidden;
@@ -167,9 +168,10 @@ textarea {
   z-index: 1081;
   top: 80%;
   left: 50%;
-  transform: scale(0.7) rotate(90deg);
 }
 .ant-image-preview-operations-wrapper .ant-image-preview-close {
+  width: 150px;
+  height: 70px;
   border-radius: 0;
   background-color: transparent;
 }
@@ -239,6 +241,19 @@ textarea {
     transform: scale(0.7) rotate(90deg) translate(-178%, -50%);
     transform-origin: left bottom;
   }
+  .ant-image-preview-operations-wrapper {
+    position: fixed;
+    width: 100%;
+    height: auto;
+    z-index: 1081;
+    top: 80%;
+    left: 50%;
+    transform: scale(0.7) rotate(90deg);
+  }
+  .ant-image-preview-operations-wrapper .ant-image-preview-close {
+    border-radius: 0;
+    background-color: transparent;
+  }
   .ant-image-preview-img-wrapper .previewImage {
     position: relative;
   }
@@ -363,8 +378,8 @@ textarea {
 }
 /* 隐藏静音按钮 */
 #root .ant-tooltip {
-  width: 220px;
-  height: 92px;
+  width: 380px;
+  height: 122px;
   max-width: 200px;
 }
 #root .ant-tooltip .ant-tooltip-content {
@@ -392,6 +407,7 @@ textarea {
   box-shadow: none !important;
   width: 100% !important;
   height: 100% !important;
+  padding: 11px 12px !important;
   border: 1px solid #ffe9b6;
   backdrop-filter: blur(2px);
 }
@@ -410,7 +426,7 @@ textarea {
 }
 #root .ant-tooltip .tooltip_MT .top {
   width: 100%;
-  height: 15px;
+  height: 20px;
   display: flex;
   justify-content: space-between;
   align-items: center;
@@ -420,11 +436,12 @@ textarea {
   height: 100%;
   font-size: 10px;
   line-height: 15px;
+  font-weight: bold;
   color: #ffe9b6;
 }
 #root .ant-tooltip .tooltip_MT .top .close {
   width: 40px;
-  height: 100%;
+  height: 18px;
   cursor: pointer;
   display: flex;
   justify-content: flex-end;
@@ -466,6 +483,9 @@ textarea {
 #opacityChange {
   animation: opacityChange 2s infinite linear;
 }
+#opacityChangeTxt {
+  animation: opacityChange 2s infinite linear;
+}
 @keyframes opacityChange {
   0% {
     opacity: 1;
@@ -481,8 +501,14 @@ textarea {
   0% {
     transform: translateX(0);
   }
+  25% {
+    transform: translateX(-20px);
+  }
   50% {
-    transform: translateX(-50px);
+    transform: translateX(0);
+  }
+  75% {
+    transform: translateX(20px);
   }
   100% {
     transform: translateX(0);

src/assets/styles/base.less

@@ -113,6 +113,7 @@ body #A7Back {
       font-size: 14px;
       color: #fff;
       margin-top: 10px;
+      white-space: nowrap;
     }
   }
 }
@@ -211,8 +212,9 @@ textarea {
   z-index: 1081;
   top: 80%;
   left: 50%;
-  transform: scale(0.7) rotate(90deg);
   .ant-image-preview-close {
+    width: 150px;
+    height: 70px;
     border-radius: 0;
     background-color: transparent;
   }
@@ -310,6 +312,20 @@ textarea {
     transform-origin: left bottom;
   }
 
+  .ant-image-preview-operations-wrapper {
+    position: fixed;
+    width: 100%;
+    height: auto;
+    z-index: 1081;
+    top: 80%;
+    left: 50%;
+    transform: scale(0.7) rotate(90deg);
+    .ant-image-preview-close {
+      border-radius: 0;
+      background-color: transparent;
+    }
+  }
+
 
   .ant-image-preview-img-wrapper {
     .previewImage {
@@ -483,8 +499,8 @@ textarea {
 // }
 
 #root .ant-tooltip {
-  width: 220px;
-  height: 92px;
+  width: 380px;
+  height: 122px;
   max-width: 200px;
 
   .ant-tooltip-content {
@@ -526,6 +542,7 @@ textarea {
     box-shadow: none !important;
     width: 100% !important;
     height: 100% !important;
+    padding: 11px 12px !important;
     border: 1px solid rgba(255, 233, 182, 1);
     backdrop-filter: blur(2px);
   }
@@ -547,7 +564,7 @@ textarea {
 
   .top {
     width: 100%;
-    height: 15px;
+    height: 20px;
     display: flex;
     justify-content: space-between;
     align-items: center;
@@ -557,12 +574,13 @@ textarea {
       height: 100%;
       font-size: 10px;
       line-height: 15px;
+      font-weight: bold;
       color: rgba(255, 233, 182, 1);
     }
 
     .close {
       width: 40px;
-      height: 100%;
+      height: 18px;
       cursor: pointer;
       display: flex;
       justify-content: flex-end;
@@ -613,6 +631,9 @@ textarea {
 #opacityChange {
   animation: opacityChange 2s infinite linear;
 }
+#opacityChangeTxt {
+  animation: opacityChange 2s infinite linear;
+}
 
 @keyframes opacityChange {
   0% {
@@ -634,8 +655,16 @@ textarea {
   }
 
 
+  25% {
+    transform: translateX(-20px);
+  }
+
   50% {
-    transform: translateX(-50px);
+    transform: translateX(0);
+  }
+
+  75% {
+    transform: translateX(20px);
   }
 
 

src/components/MenuSider/index.module.scss

@@ -8,7 +8,7 @@
   width: 66px;
   height: 66px;
 
-  &>img {
+  & > img {
     height: 100%;
     object-fit: contain;
   }
@@ -55,7 +55,7 @@
       display: flex;
       justify-content: flex-end;
 
-      &>img {
+      & > img {
         position: absolute;
         top: 50%;
         transform: translateY(-50%);
@@ -97,7 +97,7 @@
             align-items: center;
             justify-content: center;
 
-            &>img {
+            & > img {
               width: 60%;
               height: 100%;
               object-fit: contain;
@@ -124,7 +124,7 @@
           justify-content: space-between;
           gap: 10px;
 
-          &>div {
+          & > div {
             font-size: 10px;
             font-weight: lighter;
             color: #fff;
@@ -133,14 +133,13 @@
             align-items: center;
             justify-content: center;
 
-            &>img {
+            & > img {
               width: 34px;
               object-fit: contain;
             }
 
             .txt {
               font-size: 14px;
-              font-weight: 700;
             }
           }
         }
@@ -149,8 +148,6 @@
   }
 }
 
-
-
 // 英文页面
 // .menuEn {}
 
@@ -173,7 +170,7 @@
         width: 96%;
         text-align: center;
 
-        &>div {
+        & > div {
           width: 50%;
         }
 
@@ -189,4 +186,4 @@
       }
     }
   }
-}
+}

src/components/MenuSider/index.tsx

@@ -18,8 +18,8 @@ function MenuSider({ activeTab }: { activeTab: number }) {
       activeTab === 0
         ? '#/byzh?fromPath=yblm'
         : activeTab === 1
-        ? '#/byzh?fromPath=ybwx'
-        : '#/byzh?fromPath=wjwj'
+          ? '#/byzh?fromPath=ybwx'
+          : '#/byzh?fromPath=wjwj'
     )
   }
   return (
@@ -90,13 +90,13 @@ function MenuSider({ activeTab }: { activeTab: number }) {
             <div className='icon'>
               <div className='paint' onClick={() => byzhClick(activeTab)}>
                 <img src={require('@/assets/img/icon_paint.png')} alt='' />
-                <div className='txt songFontc'>
+                <div className='txt'>
                   {myLangue === 'EN' ? 'Stele Shadow Intelligence Mapping' : '碑影智绘'}
                 </div>
               </div>
               <div className='knowledge'>
                 <img src={require('@/assets/img/icon_knowledge.png')} alt='' />
-                <div className='txt songFontc' onClick={() => toEchPageFu()}>
+                <div className='txt' onClick={() => toEchPageFu()}>
                   {myLangue === 'EN' ? 'mapping knowledge domain' : '展览图谱'}
                 </div>
               </div>

src/components/Zlight/index.module.scss

@@ -19,7 +19,7 @@
         transform: translate(-50%, -50%);
         width: 73%;
 
-        &>img {
+        & > img {
           width: 100%;
           height: auto;
         }
@@ -41,15 +41,20 @@
         display: flex;
         justify-content: center;
         align-items: center;
+        gap: 8px;
         font-size: 14px;
         color: #ffe9b6;
 
-        &>img {
+        & > img {
           display: inline-block;
           // margin-right: 6px;
           width: 20px;
         }
+        .Zlimg3Txt {
+          color: rgba(255, 233, 182, 1);
+          font-size: 12px;
+        }
       }
     }
   }
-}
+}

src/components/Zlight/index.tsx

@@ -197,6 +197,7 @@ function Zlight() {
         </div>
         <div className='Zlimg3 songFont'>
           <img id='opacityChange' src={require('@/assets/sgImg/lightBs.png')} alt='' />
+          <div id='opacityChangeTxt' className="Zlimg3Txt">调整光源</div>
         </div>
       </div>
     </div>

src/pages/A0base/index.module.scss

@@ -33,10 +33,21 @@
         .title {
           max-width: 80%;
           color: rgba(124, 75, 54, 1);
-          border-bottom: 1px solid rgba(93, 96, 96, 0.4);
-          width: 160px;
+          width: 100%;
           font-size: 26px;
           transition: all 0.3s ease-in-out;
+          position: relative;
+          &::after {
+            content: '';
+            position: absolute;
+            left: -12px;
+            bottom: -4px;
+            width: 100%;
+            height: 1px;
+            background: linear-gradient(to right, rgba(93, 96, 96, 1) 0%, rgba(93, 96, 96, 0) 100%);
+            transform: scaleX(0.95);
+            transform-origin: right center;
+          }
         }
 
         .titleAc {
@@ -54,7 +65,6 @@
           max-height: 200px;
           font-size: 16px;
           line-height: 24px;
-          letter-spacing: 2px;
           color: #504e40;
           opacity: 0.7;
           text-align: justify;
@@ -70,22 +80,31 @@
         }
 
         .btn {
-          color: rgba(93, 96, 96, 1);
+          position: absolute;
+          bottom: -40px;
+          left: -3px;
+          width: 134px;
+          height: 44px;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          color: rgba(124, 75, 54, 1);
+          padding-right: 17px;
           cursor: pointer;
-          position: relative;
           font-size: 18px;
-          padding-top: 15px;
+          background: url(../../assets/img/A0_lookDetail_btn.png) no-repeat center center;
+          background-size: 100% 100%;
 
-          &::before {
-            content: '';
-            position: absolute;
-            left: 72px;
-            top: 15px;
-            width: 22px;
-            height: 22px;
-            background-image: url('../../assets/sgImg/icon_more.png');
-            background-size: 100% 100%;
-          }
+          // &::before {
+          //   content: '';
+          //   position: absolute;
+          //   left: 72px;
+          //   top: 15px;
+          //   width: 22px;
+          //   height: 22px;
+          //   background-image: url('../../assets/sgImg/icon_more.png');
+          //   background-size: 100% 100%;
+          // }
         }
       }
 
@@ -145,7 +164,6 @@
         flex-direction: column;
         gap: 8px;
         color: rgba(255, 233, 182, 1);
-        text-shadow: 0px 0px 10px rgb(8, 8, 7);
         transition: height 0.4s ease-in-out, opacity 0.3s ease-in-out;
         overflow: hidden;
         opacity: 0;

src/pages/A0base/index.tsx

@@ -78,11 +78,11 @@ function A0base() {
           </div>
           <div className={`text ${isChanging ? 'textAc' : 'textAni'} `}>{myData.baseInfo[currentBase].text}</div>
           <div
-            className='btn'
+            className='btn songFontc'
             id='opacityChange'
             onClick={e => goto(e, myData.baseInfo[currentBase].path)}
           >
-            {myLangue === 'ZH' ? '查看详情' : 'view details'}
+            {myLangue === 'ZH' ? '进入单元' : 'view details'}
           </div>
         </div>
         <div className='baseContent'>

src/pages/A1home2/index.module.scss

@@ -5,7 +5,6 @@
   z-index: 1;
 
   :global {
-
     // 背景图
     .homeImg {
       position: absolute;
@@ -46,7 +45,6 @@
         z-index: 4;
       }
 
-
       .progress {
         width: 200px;
         height: 30px;
@@ -71,7 +69,7 @@
         position: relative;
         z-index: 10;
 
-        &>img {
+        & > img {
           width: 60%;
           height: 60%;
           object-fit: contain;
@@ -111,15 +109,10 @@
         width: 100%;
         height: 100%;
       }
-
     }
-
-
-
   }
 }
 
-
 // --------------英文版
 .A1homeEm {
   :global {
@@ -132,9 +125,8 @@
           width: 42px;
           height: 21px;
           font-size: 16px;
-
         }
       }
     }
   }
-}
+}

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

@@ -19,7 +19,7 @@
       width: 120px;
       height: 60px;
 
-      &>img {
+      & > img {
         height: 100%;
         object-fit: contain;
       }
@@ -43,7 +43,6 @@
         font-weight: bold;
         white-space: nowrap;
         width: 40px;
-        text-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5);
 
         &::after {
           content: '';
@@ -55,7 +54,6 @@
           left: 50%;
           transform: translate(-57%, 147%);
           background-color: rgba(124, 75, 54, 1);
-          box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5);
         }
       }
 
@@ -71,9 +69,8 @@
 
 // --------英文版-----
 .IntroEn {
-
   :global {
-    .titleLogo{
+    .titleLogo {
       width: auto;
       height: 24px;
     }
@@ -89,4 +86,4 @@
       }
     }
   }
-}
+}

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

@@ -39,10 +39,11 @@
           font-size: 10px;
           line-height: 50px;
           color: #fff;
+          text-shadow: 0px 0px 4px #7c4b36;
           position: absolute;
           align-self: flex-start;
 
-          &>img {
+          & > img {
             width: 100%;
             object-fit: contain;
           }
@@ -73,7 +74,7 @@
           cursor: pointer;
           position: relative;
 
-          &>img {
+          & > img {
             height: 60px;
             object-fit: contain;
           }
@@ -139,7 +140,6 @@
           height: 14px;
           background-image: url(../../../../assets/img/A2_backDian.png);
           background-size: 100% 100%;
-
         }
 
         .intro_title {
@@ -157,17 +157,18 @@
           overflow-y: auto;
           margin-bottom: 10px;
           // text-align: justify;
-          mask-image: linear-gradient(to bottom,
-              rgba(0, 0, 0, 1) 0%,
-              rgba(0, 0, 0, 1) 95%,
-              /* 保留顶部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) 95%,
-              rgba(0, 0, 0, 0) 100%);
+          mask-image: linear-gradient(
+            to bottom,
+            rgba(0, 0, 0, 1) 0%,
+            rgba(0, 0, 0, 1) 95%,
+            /* 保留顶部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) 95%,
+            rgba(0, 0, 0, 0) 100%
+          );
 
           &::-webkit-scrollbar {
             width: 0px;
@@ -229,13 +230,11 @@
           height: 14px;
           background-image: url(../../../../assets/img/A2_backDian.png);
           background-size: 100% 100%;
-
         }
 
         .txtWithTrans {
           font-size: 16px !important;
-          line-height: 22px !important;
-          letter-spacing: 2px;
+          line-height: 32px !important;
           height: 90%;
           width: 100%;
           text-align: justify;
@@ -244,23 +243,24 @@
           overflow: auto;
           padding: 20px 30px;
 
-          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;
           }
 
-          &>a {
+          & > a {
             color: black;
             position: relative;
 
@@ -268,10 +268,10 @@
               content: '';
               position: absolute;
               left: 0;
-              bottom: -2px;
+              bottom: -4px;
               width: 100%;
               height: 2px;
-              background-color: rgba(166, 118, 67, 1);
+              background-color: rgba(208, 131, 63, 1);
               transform: scaleX(0.95);
               transform-origin: right center;
             }
@@ -348,11 +348,11 @@
               color: rgba(0, 0, 0, 0.25);
             }
 
-            &:has(> a:hover)>a:not(:hover) {
+            &:has(> a:hover) > a:not(:hover) {
               color: rgba(0, 0, 0, 0.25);
             }
 
-            &>a {
+            & > a {
               color: rgba(94, 52, 34, 1);
               position: relative;
 
@@ -408,7 +408,7 @@
           // letter-spacing: 2px;
           color: #504e40;
 
-          &>p {
+          & > p {
             padding-bottom: 10px;
           }
         }
@@ -476,4 +476,4 @@
     //   }
     // }
   }
-}
+}

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

@@ -42,7 +42,7 @@
       background-image: url('../../../../assets/img/A2_shufa_bg1.jpg');
       background-size: 100% 100%;
       background-repeat: no-repeat;
-      gap: 20px;
+      gap: 31px;
       transition: all 0.6s ease-in-out;
 
       .sLeft {
@@ -68,17 +68,19 @@
         }
 
         .leftTxt1 {
-          width: 78%;
+          width: 72%;
+          text-align: justify;
           height: 20%;
           color: #51504e;
-          font-size: 13px;
-          line-height: 20px;
+          font-size: 11px;
+          line-height: 15px;
         }
       }
 
       .sRight {
         width: 52%;
         height: 100%;
+        margin-right: -6px;
 
         .rightTitle1 {
           width: 88%;
@@ -86,20 +88,21 @@
           color: rgba(94, 52, 34, 1);
           font-size: 16px;
           line-height: 22px;
+          margin-top: 16px;
         }
 
         .rightTitleLine1 {
-          transform: translateY(-8px);
+          transform: translateY(-3px);
           width: 88%;
-          height: 23px;
+          height: 12px;
           background: url(../../../../assets/img/A2_shufa_title_bg.png) no-repeat;
           background-size: 100% 100%;
         }
 
         .rightIntro {
           margin-top: 40px;
-          width: 88%;
-          height: 37%;
+          width: 85%;
+          height: 32%;
           color: rgba(69, 68, 55, 1);
           background: url(../../../../assets/img/A2_shufa_txt_bg.png) no-repeat;
           background-size: 100% 100%;
@@ -107,7 +110,7 @@
           .rightItem {
             width: 100%;
             transform: translateY(-21px);
-            height: 41px;
+            height: 35px;
             white-space: nowrap;
 
             .rLabel {
@@ -135,12 +138,13 @@
         }
 
         .rightTxt1 {
-          font-size: 14px;
-          margin-top: 10px;
+          font-size: 11px;
+          margin-top: 17px;
           color: #51504e;
-          width: 88%;
+          width: 83%;
           height: fit-content;
           text-align: justify;
+          line-height: 15px;
         }
 
         .shufa1Btn {
@@ -151,8 +155,27 @@
           display: flex;
           justify-content: center;
           align-items: center;
-          color: rgba(255, 233, 182, 0.8);
+          color: rgba(255, 233, 182, 1);
           font-size: 17px;
+          margin-top: 10px;
+        }
+      }
+    }
+
+    // 移动端
+
+    @media screen and (max-width: 768px) {
+      .shufa1 {
+        .sLeft {
+          .leftTxt1 {
+            font-size: 13px;
+            width: 78%;
+          }
+        }
+        .sRight {
+          .rightTxt1 {
+            font-size: 13px;
+          }
         }
       }
     }

src/pages/A2yblm/index.module.scss

@@ -103,11 +103,14 @@
       left: 50%;
       transform: translate(-50%, -50%);
       background-color: rgba(0, 0, 0, 0.7);
+      background-image: url(../../assets/img/A2_mzm_bg.png);
+      background-repeat: no-repeat;
+      background-size: 100% 100%;
       backdrop-filter: blur(3px);
       display: flex;
       flex-direction: column;
       gap: 10px;
-      padding: 20px 55px;
+      padding: 36px 78px;
 
       .top {
         display: flex;
@@ -117,8 +120,8 @@
         height: 50px;
 
         .title {
-          font-size: 18px;
-          font-weight: 500;
+          font-size: 24px;
+          font-weight: bold;
           color: #fbebbd;
         }
 
@@ -136,8 +139,7 @@
 
       .content {
         font-size: 16px;
-        line-height: 24px;
-        letter-spacing: 3px;
+        line-height: 35px;
         font-weight: 400;
         text-align: justify;
         padding-top: 40px;
@@ -155,6 +157,12 @@
       }
     }
 
+    .mzm1 {
+      .content {
+        padding-top: 20px;
+      }
+    }
+
     // sider内容
     .sider1 {
       width: 38%;

src/pages/A2yblm/index.tsx

@@ -187,9 +187,9 @@ function A2yblm() {
       )}
 
       {isOpenMzm && (
-        <div className='mzm'>
+        <div className={`mzm ${Number(localStorage.getItem('selectedBeiwen')) - 1 === 0 ? 'mzm1' : 'mzm2'}`}>
           <div className='top'>
-            <div className='title'>
+            <div className='title songFont'>
               {
                 myData.readDetail[Number(localStorage.getItem('selectedBeiwen')) - 1 ?? 0].mzmtz
                   .title

src/pages/A3beie/index.module.scss

@@ -4,7 +4,6 @@
   position: relative;
 
   :global {
-
     // 重置亮度滚动位置
     #Zlight {
       right: auto;
@@ -36,7 +35,7 @@
           position: relative;
           font-size: 24px;
           letter-spacing: 3px;
-          text-shadow: 1px 1px 1px #945b46;
+          text-shadow: 0px 0px 10px rgba(124, 75, 54, 1);
 
           .butterflyR {
             width: 20px;
@@ -45,7 +44,7 @@
             top: -67%;
             left: 5%;
 
-            &>img {
+            & > img {
               height: 100%;
               object-fit: contain;
             }
@@ -63,8 +62,6 @@
       }
     }
 
-
-
     // 文物鉴赏
     .wenwu {
       bottom: 2%;
@@ -75,7 +72,7 @@
       z-index: 100;
       cursor: pointer;
 
-      &>img {
+      & > img {
         height: 100%;
         object-fit: contain;
       }
@@ -90,7 +87,7 @@
       top: 3%;
       right: 3%;
 
-      &>img {
+      & > img {
         height: 100%;
         object-fit: contain;
       }
@@ -98,7 +95,6 @@
   }
 }
 
-
 // ----------------英文版
 .A3beieEn {
   :global {
@@ -127,9 +123,7 @@
           letter-spacing: 0;
           text-align: start;
         }
-
-
       }
     }
   }
-}
+}

src/pages/A4quanwen/index.module.scss

@@ -87,7 +87,11 @@
           .line {
             width: 1px;
             height: 100%;
-            background-color: rgba(69, 68, 55, 1);
+            background: linear-gradient(
+              to bottom,
+              rgba(124, 75, 54, 1) 0%,
+              rgba(124, 75, 54, 0.1) 100%
+            );
           }
         }
 

src/pages/A6ybwx/A6_1_zxys/index.module.scss

@@ -30,11 +30,11 @@
 
     .title {
       position: absolute;
-      top: 15%;
+      top: 12%;
       left: 50%;
-      transform: translateX(-115%);
-      height: 60px;
-      width: 330px;
+      transform: translateX(-100%);
+      height: 94px;
+      width: 380px;
 
       & > img {
         height: 100%;
@@ -44,7 +44,7 @@
 
     .zaoxiang_text {
       position: absolute;
-      top: 30%;
+      top: 38%;
       left: 50%;
       transform: translateX(-115%);
       height: 60px;
@@ -120,6 +120,16 @@
   width: 100%;
   height: 100%;
   position: absolute;
+  &:global(.D0) {
+    :global {
+      .detailpageContent {
+        .txtcontent {
+          transform: translate(-89%, -190%);
+          width: 330px;
+        }
+      }
+    }
+  }
 
   :global {
     .detailpageTop {
@@ -176,6 +186,8 @@
           font-weight: lighter;
           text-align: center;
           font-weight: 700;
+          line-height: 20px;
+          text-shadow: 2px 2px 7px #bf4403;
         }
 
         .dtxt {
@@ -225,7 +237,6 @@
         font-size: 16px;
         color: rgba(93, 96, 96, 1);
         text-align: justify;
-        letter-spacing: 2px;
         line-height: 26px;
       }
 
@@ -268,7 +279,6 @@
             writing-mode: vertical-lr;
             height: auto;
             font-size: 14px;
-            letter-spacing: 2px;
           }
 
           .icon3 {
@@ -332,7 +342,11 @@
       }
 
       .foxiang2 {
-        transform: translate(122%, -47%);
+        height: 100%;
+        transform: translate(133%, -45%);
+        & > img {
+          scale: 1.6;
+        }
         .foxiangLine {
           transform: translate(-69%, 89%);
           width: 40%;

src/pages/A6ybwx/A6_1_zxys/index.tsx

@@ -13,6 +13,7 @@ function Zaoxiang({ setGotopage }: { setGotopage: (page: number) => void }) {
   const [isShowDetail, setIsShowDetail] = useState(false)
 
   const currentItem = React.useMemo(() => myData.zaoxiangDataDetail.find(item => item.type === currentType), [currentType, myData.zaoxiangDataDetail])
+  console.log(currentItem)
   const currentItemIndex = React.useMemo(() => myData.zaoxiangDataDetail.findIndex(item => item.type === currentType), [currentType, myData.zaoxiangDataDetail])
 
 
@@ -29,7 +30,7 @@ function Zaoxiang({ setGotopage }: { setGotopage: (page: number) => void }) {
         <img src={require('@/assets/img/A6_zaoxiang_title.png')} draggable='false' alt='' />
       </div>
       <div className='zaoxiang_text'>
-        <div className='t1 songFont'>东西方石刻技艺相融结合的完美范例之一</div>
+        {/* <div className='t1 songFont'>东西方石刻技艺相融结合的完美范例之一</div> */}
         <div className='line1'>
           <img src={require('@/assets/img/A6_zaoxiang_line1.png')} draggable='false' alt='' />
         </div>
@@ -53,7 +54,7 @@ function Zaoxiang({ setGotopage }: { setGotopage: (page: number) => void }) {
 
       {/* 高浮雕 */}
       {isShowDetail && (
-        <div className={classNames(styles.detailPage, isPc ? '' : styles.detailPageMo)}>
+        <div className={classNames(styles.detailPage, isPc ? '' : styles.detailPageMo, 'D' + currentItemIndex)}>
           <div className='detailpageTop'></div>
           <div className='detailpageContent'>
             <div className='back' onClick={() => setIsShowDetail(false)}>
@@ -97,8 +98,8 @@ function Zaoxiang({ setGotopage }: { setGotopage: (page: number) => void }) {
               ))}
             </div>
             <div className={`foxiang${currentItemIndex}`}>
-              <img src={require('@/assets/img/A6_zaoxiang_foxiang.png')} draggable='false' alt='' />
-              <img className={`foxiangLine`} src={currentItem?.lineSrc} draggable='false' alt='' />
+              <img src={currentItem?.foxiangUrl} draggable='false' alt='' />
+              {/* <img className={`foxiangLine`} src={currentItem?.lineSrc} draggable='false' alt='' /> */}
             </div>
           </div>
         </div>)}

src/pages/A6ybwx/A6_2_zxzgh/components/Bq/index.module.scss

@@ -88,6 +88,7 @@
         color: rgba(93, 96, 96, 1);
         & > span {
           font-size: 20px;
+          font-weight: bold;
           color: rgba(169, 135, 99, 1);
         }
       }
@@ -156,15 +157,14 @@
               z-index: 1;
               &::after {
                 content: '';
-                width: 40px;
-                height: 4px;
+                width: 46px;
+                height: 7px;
                 position: absolute;
                 z-index: -1;
                 top: 50%;
                 left: 50%;
                 transform: translate(-480%, 65%);
                 background-color: rgb(197, 185, 144);
-                box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5);
               }
             }
             .lText {
@@ -436,6 +436,7 @@
         font-weight: 400;
         color: rgba(93, 96, 96, 1);
         & > span {
+          font-weight: bold;
           font-size: 20px;
           color: rgba(169, 135, 99, 1);
         }
@@ -480,15 +481,14 @@
             z-index: 1;
             &::after {
               content: '';
-              width: 46px;
-              height: 4px;
+              width: 32px;
+              height: 7px;
               position: absolute;
               z-index: -1;
               top: 50%;
               left: 50%;
-              transform: translate(-223%, 65%);
+              transform: translate(-327%, 65%);
               background-color: rgb(197, 185, 144);
-              box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5);
             }
           }
           .lText {
@@ -519,6 +519,7 @@
         width: 180px;
         .item {
           .lTitle::after {
+            width: 46px;
             transform: translate(-141%, 65%);
           }
         }

src/pages/A6ybwx/A6_2_zxzgh/components/Bwwq/index.module.scss

@@ -170,15 +170,14 @@
               z-index: 1;
               &::after {
                 content: '';
-                width: 40px;
-                height: 4px;
+                width: 32px;
+                height: 7px;
                 position: absolute;
                 z-index: -1;
                 top: 50%;
                 left: 50%;
                 transform: translate(-480%, 65%);
                 background-color: rgb(197, 185, 144);
-                box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5);
               }
             }
             .lText {

src/pages/A6ybwx/A6_2_zxzgh/components/Bwzwq/index.module.scss

@@ -152,15 +152,14 @@
               z-index: 1;
               &::after {
                 content: '';
-                width: 40px;
-                height: 4px;
+                width: 32px;
+                height: 7px;
                 position: absolute;
                 z-index: -1;
                 top: 50%;
                 left: 50%;
-                transform: translate(-441%, 65%);
+                transform: translate(-553%, 65%);
                 background-color: rgb(197, 185, 144);
-                box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5);
               }
             }
             .lText {
@@ -366,14 +365,13 @@
             &::after {
               content: '';
               width: 46px;
-              height: 4px;
+              height: 7px;
               position: absolute;
               z-index: -1;
               top: 50%;
               left: 50%;
               transform: translate(-166%, 65%);
               background-color: rgb(197, 185, 144);
-              box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5);
             }
           }
           .lText {

src/pages/A6ybwx/A6_2_zxzgh/components/Bwzzq/index.module.scss

@@ -186,14 +186,13 @@
               &::after {
                 content: '';
                 width: 32px;
-                height: 4px;
+                height: 7px;
                 position: absolute;
                 z-index: -1;
                 top: 50%;
-                left: 50%;
+                left: 47%;
                 transform: translate(-402%, 65%);
                 background-color: rgb(197, 185, 144);
-                box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5);
               }
             }
             .lText {
@@ -370,14 +369,13 @@
             &::after {
               content: '';
               width: 46px;
-              height: 4px;
+              height: 7px;
               position: absolute;
               z-index: -1;
               top: 50%;
               left: 50%;
               transform: translate(-144%, 65%);
               background-color: rgb(197, 185, 144);
-              box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5);
             }
           }
           .lText {

src/pages/A6ybwx/A6_2_zxzgh/components/Bz/index.module.scss

@@ -141,15 +141,14 @@
               z-index: 1;
               &::after {
                 content: '';
-                width: 40px;
-                height: 4px;
+                width: 32px;
+                height: 7px;
                 position: absolute;
                 z-index: -1;
                 top: 50%;
                 left: 50%;
-                transform: translate(-480%, 65%);
+                transform: translate(-277%, 65%);
                 background-color: rgb(197, 185, 144);
-                box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5);
               }
             }
             .lText {
@@ -364,14 +363,13 @@
             &::after {
               content: '';
               width: 46px;
-              height: 4px;
+              height: 7px;
               position: absolute;
               z-index: -1;
               top: 50%;
               left: 50%;
               transform: translate(-150%, 65%);
               background-color: rgb(197, 185, 144);
-              box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5);
             }
           }
           .lText {

src/pages/A6ybwx/A6_2_zxzgh/index.module.scss

@@ -123,7 +123,7 @@
         width: 100%;
       }
       .name {
-        font-size: 10px;
+        font-size: 16px;
         font-weight: 500;
         color: rgba(170, 105, 77, 1);
         text-align: center;

src/pages/A6ybwx/Genealogy/index.module.scss

@@ -125,10 +125,14 @@
 
       .big {
         width: 100%;
-        height: 25px;
+        height: 35px;
         font-size: 24px;
         color: rgba(255, 233, 182, 1);
         margin-bottom: 8px;
+        & > img {
+          height: 100%;
+          object-fit: contain;
+        }
       }
 
       .small {
@@ -231,6 +235,19 @@
         gap: 10px;
         overflow: auto;
         margin-bottom: 26px;
+        padding-bottom: 20px;
+        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: 0;
@@ -249,8 +266,9 @@
           }
 
           .txt {
-            width: 100%;
-            font-size: 15px;
+            margin-top: 6px;
+            width: 93%;
+            font-size: 14px;
             color: rgba(93, 96, 96, 1);
             max-height: calc(100% - 50px);
             text-align: justify;

src/pages/A6ybwx/Genealogy/index.tsx

@@ -4,6 +4,7 @@ import Graph from './components/Graph'
 import MemuSider from '@/components/MenuSider'
 import { useSelector } from 'react-redux'
 import { RootState } from '@/store'
+import { isMobiileFu } from '@/utils/history'
 // import SvgGraph from './components/GraphSVG'
 function Genealogy({ setGotoTab }: { setGotoTab: (tab: number) => void }) {
   const [isShowIntro, setIsShowIntro] = useState(true)
@@ -41,15 +42,15 @@ function Genealogy({ setGotoTab }: { setGotoTab: (tab: number) => void }) {
         <img src={require('@/assets/img/A6_gen_icon1.png')} alt='' />
       </div>
       <div className={`${styles.gesture} ${gestureState1}`} onClick={() => setIsShowGesture(false)}>
-        <img src={require('@/assets/img/A6_gen_gesture.png')} draggable='false' alt='' />
-        点击查看更多
+        <img src={require(`@/assets/img/${isMobiileFu() ? 'A6_gen_gesture1' : 'A6_gen_gesture'}.png`)} draggable='false' alt='' />
+        {isMobiileFu() ? '左右滑动查看更多' : <>滚轮放大< br /> 左右拖拽移动</>}
       </div>
       )
       {isShowIntro && (
         <div className={styles.intro}>
           <div className='title'>
-            <div className='big songFont'>{myData?.genealogyIntro?.bigTitle}</div>
-            <div className='small'>{myData?.genealogyIntro?.smallTitle}</div>
+            <div className='big songFont'><img src={require('@/assets/img/A6_gen_sxmy.png')} draggable='false' alt="" /></div>
+            {/* <div className='small'>{myData?.genealogyIntro?.smallTitle}</div> */}
             <div className='sun'></div>
           </div>
           <div className='line'>

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

@@ -115,7 +115,7 @@ function Policy({ setShowTab }: { setShowTab: (tab: number) => void }) {
                           {isOriStates[part2Index] ? part2Item.from : part2Item.from_ac}
                         </div>
                         <div className='name songFont'>{part2Item.name}</div>
-                        <div className='time songFont'>{part2Item.time}</div>
+                        <div className='time songFont' dangerouslySetInnerHTML={{ __html: part2Item.time }}></div>
                         <div className='changeBar'>
                           <div
                             className={`yuan ${isOriStates[part2Index] ? 'cActive' : ''}`}

src/pages/A6ybwx/Sangzang/components/Sangzangys/index.module.scss

@@ -26,13 +26,14 @@
       .lHidding {
         width: 300px;
         height: 100%;
-        background: url('../../../../../assets/img/A6_sangzang_hidContent.png') no-repeat center center;
+        background: url('../../../../../assets/img/A6_sangzang_hidContent.png') no-repeat center
+          center;
         background-size: 100% 100%;
         position: absolute;
         z-index: 1;
         top: 50%;
         left: 0;
-        transform: translate(-88%, -50%);
+        transform: translate(-100%, -50%);
         display: flex;
         align-items: center;
         justify-content: flex-end;
@@ -46,7 +47,8 @@
           height: 100%;
           display: flex;
           align-items: center;
-          background: url('../../../../../assets/img/A6_sangzang_hidding_left.png') no-repeat center center;
+          background: url('../../../../../assets/img/A6_sangzang_hidding_left.png') no-repeat center
+            center;
           background-size: 100% 100%;
           transition: all 0.6s ease-in-out;
 
@@ -68,7 +70,8 @@
               .pic {
                 width: 100%;
                 height: 100%;
-                background: url('../../../../../assets/img/A6_sangzang_mzw0.png') no-repeat center center;
+                background: url('../../../../../assets/img/A6_sangzang_mzw0.png') no-repeat center
+                  center;
                 background-size: contain;
               }
 
@@ -82,7 +85,7 @@
                 justify-content: center;
                 align-items: center;
 
-                &>img {
+                & > img {
                   height: 20px;
                   width: 20px;
                   object-fit: contain;
@@ -195,7 +198,8 @@
             .pic {
               width: 100%;
               height: 100%;
-              background: url('../../../../../assets/img/A6_sangzang_mzw1.png') no-repeat center center;
+              background: url('../../../../../assets/img/A6_sangzang_mzw1.png') no-repeat center
+                center;
               background-size: contain;
             }
 
@@ -209,7 +213,7 @@
               justify-content: center;
               align-items: center;
 
-              &>img {
+              & > img {
                 height: 20px;
                 width: 20px;
                 object-fit: contain;
@@ -264,7 +268,8 @@
 
           .openPic {
             opacity: 0;
-            background: url('../../../../../assets/img/A6_sangzang_hidRight.png') no-repeat center center;
+            background: url('../../../../../assets/img/A6_sangzang_hidRight.png') no-repeat center
+              center;
             background-size: 100% 100%;
             height: 100%;
             width: 100%;
@@ -355,8 +360,8 @@
             max-width: 100%;
             font-size: 24px;
             color: #fff;
-            text-shadow: 1px 1px 1px #7C4B36;
             margin-bottom: 20px;
+            text-shadow: 0px 0px 10px rgba(124, 75, 54, 1);
             // border-bottom: 1px solid rgba(93, 96, 96, 0.4);
           }
 
@@ -395,7 +400,7 @@
             line-height: 50px;
             cursor: pointer;
 
-            &>img {
+            & > img {
               height: 90%;
               position: absolute;
               z-index: -1;
@@ -426,7 +431,8 @@
           right: -2%;
 
           .openPic {
-            background: url('../../../../../assets/img/A6_sangzang_hidLeft.png') no-repeat center center;
+            background: url('../../../../../assets/img/A6_sangzang_hidLeft.png') no-repeat center
+              center;
             background-size: 100% 100%;
             animation: opacityChange 3s infinite ease-in-out;
           }
@@ -435,9 +441,13 @@
 
       .showRight {
         width: 69%;
-
+        background-size: 100% 105%;
+        .lHidding_left {
+          background-size: 100% 105%;
+        }
         .lHidding_right {
           transition: all 0.3s ease-in-out 0.3s;
+
           opacity: 1;
           pointer-events: auto;
         }
@@ -469,8 +479,9 @@
       .lHidding {
         width: 330px;
         transform: translate(-7%, -50%);
-        background: url('../../../../../assets/img/A6_sangzang_hidContent_r.png') no-repeat center center;
-        background-size: 100% 100%;
+        background: url('../../../../../assets/img/A6_sangzang_hidContent_r.png') no-repeat center
+          center;
+        background-size: 100% 105%;
 
         .lHidding_left {
           display: none;
@@ -520,7 +531,8 @@
         .lHidding_right {
           .imgBox {
             .pic {
-              background: url('../../../../../assets/img/A6_sangzang_mzw2.png') no-repeat center center;
+              background: url('../../../../../assets/img/A6_sangzang_mzw2.png') no-repeat center
+                center;
               background-size: 100% 100%;
             }
           }
@@ -560,10 +572,13 @@
       padding-left: 140px;
 
       .lHidding {
+        width: 300px;
         .lHidding_right {
+          width: 300px;
           .imgBox {
             .pic {
-              background: url('../../../../../assets/img/A6_sangzang_mzw3.png') no-repeat center center;
+              background: url('../../../../../assets/img/A6_sangzang_mzw3.png') no-repeat center
+                center;
               background-size: 100% 100%;
             }
           }
@@ -574,7 +589,7 @@
         width: 300px;
 
         .pic {
-          right: 35%;
+          right: 44%;
           top: 23%;
           transform: scale(1.9);
           position: relative;
@@ -601,7 +616,9 @@
           align-items: center;
 
           .text {
-            width: 98%;
+            position: relative;
+            right: 20px;
+            width: 100%;
             height: 90%;
             max-height: 90%;
             line-height: 26px;
@@ -662,7 +679,7 @@
       .left {
         .pic {
           top: 134%;
-          right: 90%;
+          right: 120%;
           transform: scale(3.4);
         }
       }
@@ -675,8 +692,10 @@
           width: 100%;
 
           .text {
-            width: 80%;
-            padding-top: 30px;
+            position: relative;
+            width: 100%;
+            padding-top: 52px;
+            right: 70px;
           }
         }
       }
@@ -691,7 +710,7 @@
       left: 4%;
       cursor: pointer;
 
-      &>img {
+      & > img {
         height: 100%;
         object-fit: fill;
       }
@@ -724,13 +743,13 @@
         line-height: 15px;
         letter-spacing: 1px;
         font-weight: 500;
-        color: #FFE9B6;
+        color: #ffe9b6;
         cursor: pointer;
       }
 
       .tab_active {
         background-image: url('../../../../../assets/sgImg/ComponentAc.png');
-        color: #5D1E20;
+        color: #5d1e20;
       }
     }
 
@@ -797,7 +816,7 @@
             cursor: pointer;
             position: relative;
 
-            &>img {
+            & > img {
               width: 60px;
               object-fit: cover;
             }
@@ -838,7 +857,7 @@
           display: flex;
           align-items: center;
 
-          &>div {
+          & > div {
             width: 100%;
             max-height: 100%;
             font-size: 16px;
@@ -854,8 +873,6 @@
               height: 0px;
             }
           }
-
-
         }
       }
     }
@@ -930,24 +947,23 @@
           height: 500px;
           display: flex;
           justify-content: center;
-          align-items: center;
           padding-bottom: 30px;
           max-height: 80%;
           color: rgba(255, 255, 255, 1);
           overflow: auto;
           font-weight: 400;
-          letter-spacing: 2px;
-          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;
@@ -963,7 +979,7 @@
         top: 21px;
         right: 32px;
 
-        &>img {
+        & > img {
           width: 100%;
           height: 100%;
           object-fit: contain;
@@ -978,4 +994,4 @@
       pointer-events: auto;
     }
   }
-}
+}

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

@@ -76,9 +76,8 @@ function Sangzangys({ setShowTab }: { setShowTab: (tab: number) => void }) {
         mainAc：点击了tab0的按钮后，弹出右侧隐藏内容
         mainShow_tab1~4：选中tab1~4时的样式 */}
       <div
-        className={`main ${
-          isShowHidContent ? 'mainAc' : currentTab === 'tab0' ? '' : 'mainShow_' + currentTab
-        }`}
+        className={`main ${isShowHidContent ? 'mainAc' : currentTab === 'tab0' ? '' : 'mainShow_' + currentTab
+          }`}
       >
         {/* 左侧隐藏内容 */}
         <div className={`lHidding ${isShowHidContentRight ? 'showRight' : ''}`}>
@@ -218,9 +217,8 @@ function Sangzangys({ setShowTab }: { setShowTab: (tab: number) => void }) {
           <div
             className='pic'
             style={{
-              background: `url(${require(`@/assets/img/A6_sangzang_geshi${
-                selectedGeshi === 0 ? '1' : selectedGeshi
-              }.png`)}) no-repeat center/contain`
+              background: `url(${require(`@/assets/img/A6_sangzang_geshi${selectedGeshi === 0 ? '1' : selectedGeshi
+                }.png`)}) no-repeat center/contain`
             }}
           />
         </div>
@@ -236,9 +234,8 @@ function Sangzangys({ setShowTab }: { setShowTab: (tab: number) => void }) {
                 }}
               >
                 <img
-                  src={require(`@/assets/img/btn_ModalTxt_bg${
-                    selectedGeshi === item.key ? '_ac' : ''
-                  }.png`)}
+                  src={require(`@/assets/img/btn_ModalTxt_bg${selectedGeshi === item.key ? '_ac' : ''
+                    }.png`)}
                   alt=''
                 />
                 <div className={`tabNub songFont ${selectedGeshi === item.key ? 'tabNubAc' : ''}`}>
@@ -271,7 +268,11 @@ function Sangzangys({ setShowTab }: { setShowTab: (tab: number) => void }) {
           ></div>
         </div>
         <div className='mzwHotR'>
-          <div className='mtitle songFont'>{myData.mzw[mzwCurrentIndex].title}</div>
+          <div className='mtitle songFont' style={{
+            ...((mzwCurrentIndex === 0 || mzwCurrentIndex === 1) && {
+              textAlign: 'center'
+            })
+          }}>{myData.mzw[mzwCurrentIndex].title}</div>
           <div
             className='mtext'
             style={{

src/pages/A6ybwx/Sangzang/index.module.scss

@@ -24,7 +24,7 @@
       left: 4%;
       cursor: pointer;
 
-      &>img {
+      & > img {
         height: 100%;
         object-fit: fill;
       }
@@ -33,7 +33,7 @@
     .homeLeft {
       position: absolute;
       top: 14%;
-      left: 8%;
+      left: 6%;
       width: 385px;
       height: 68%;
       display: flex;
@@ -76,7 +76,7 @@
             font-weight: 400;
             color: rgba(124, 75, 54, 1);
             opacity: 0.7;
-           
+
             // margin-bottom: 10px;
 
             .htxt {
@@ -88,18 +88,16 @@
               width: 100%;
               text-align: right;
               height: fit-content;
-            //    position: relative;
-            // top: -4px;
+              //    position: relative;
+              // top: -4px;
               // margin-bottom: 5px;
             }
-            .lastTxt{
+            .lastTxt {
               text-align: right;
             }
           }
         }
       }
-
-
     }
 
     .btnContainner {
@@ -112,7 +110,7 @@
       display: flex;
       // align-items: center;
       justify-content: center;
-      gap: 20px;
+      gap: 8px;
       cursor: pointer;
 
       .btn {
@@ -133,4 +131,4 @@
       }
     }
   }
-}
+}

src/pages/A6ybwx/StatueArt/index.module.scss

@@ -44,29 +44,29 @@
     }
 
     .Stext {
-      width: 176px;
+      width: 240px;
       height: 95%;
       font-size: 14px;
       letter-spacing: 0px;
-      line-height: 24px;
+      line-height: 30px;
       color: rgb(91, 71, 46);
       font-weight: 300;
-      transform: translate(103%, 20%);
+      transform: translate(90%, 23%);
       text-align: justify;
     }
 
     .ffhybtn1 {
       cursor: pointer;
-      height: 300px;
-      width: 215px;
-      transform: translate(-13%, -50%);
+      height: 85px;
+      width: 253px;
+      transform: translate(30%, -110%);
     }
 
     .ffhybtn2 {
       cursor: pointer;
-      height: 300px;
-      width: 215px;
-      transform: translate(90%, -50%);
+      height: 85px;
+      width: 253px;
+      transform: translate(30%, -7%);
     }
   }
 }
@@ -85,6 +85,12 @@
         object-fit: fill !important;
       }
     }
+    .Stext {
+      font-size: 16px;
+      height: 90%;
+      line-height: 27px;
+      font-weight: 400;
+    }
 
     .ffhyTitle {
       width: 160px;
@@ -96,10 +102,15 @@
     .ffhybtn2 {
       left: 49%;
       // height: 300px;
-      width: 190px;
+      width: 250px;
+      height: 95px;
+      transform: translate(37%, -110%);
       & > img {
         object-fit: contain !important;
       }
     }
+    .ffhybtn2 {
+      transform: translate(37%, -7%);
+    }
   }
 }

src/pages/A6ybwx/index.tsx

@@ -95,7 +95,7 @@ function A6ybwx() {
         domDelOwnFu('.videoBox')
       }, 100)
       // 切换场景
-      cutUnityFu('RoomScene', () => {})
+      cutUnityFu('RoomScene', () => { })
     }
   }, [isEnter])
 

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

@@ -27,7 +27,7 @@
       transform: translate(-50%, -50%);
       background: url('../../../../assets/img/A7Poem_bg.png') no-repeat center center;
       background-size: 100% 100%;
-      backdrop-filter: blur(5px);
+      backdrop-filter: blur(10px);
 
       .back {
         width: 120px;
@@ -103,10 +103,8 @@
 
         .content {
           font-weight: 400;
-          letter-spacing: 2px;
           font-size: 16px;
           line-height: 28px;
-          font-family: 'song' !important;
           text-shadow: 1px 1px 1px rgba(255, 233, 182, 0.5);
         }
       }

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

@@ -32,7 +32,7 @@
 
         .text {
           font-size: 9px;
-          max-height: 71px;
+          max-height: 77px;
           overflow: auto;
           &::-webkit-scrollbar {
             width: 0;
@@ -52,7 +52,7 @@
       .record1 {
         width: 200px;
         height: 75px;
-        transform: translate(-80%, -121%);
+        transform: translate(-149px, -104px);
         background: url('../../../../assets/img/A7_discover_record1.png') no-repeat center center;
         background-size: 100% 100%;
       }
@@ -60,7 +60,7 @@
       .record2 {
         width: 130px;
         height: 60px;
-        transform: translate(0%, 166%);
+        transform: translate(0%, 94px);
         background: url('../../../../assets/img/A7_discover_record2.png') no-repeat center center;
         background-size: 100% 100%;
 
@@ -87,18 +87,21 @@
       .record3 {
         width: 155px;
         height: 45px;
-        transform: translate(21%, -48%);
+        transform: translate(25px, -26px);
         background: url('../../../../assets/img/A7_discover_record3.png') no-repeat center center;
         background-size: 100% 100%;
         display: flex;
         align-items: center;
-        flex-direction: row;
+        padding: 7px 10px;
+        .text {
+          overflow: hidden;
+        }
       }
 
       .record4 {
         width: 140px;
         height: 25px;
-        transform: translate(-95%, 270%);
+        transform: translate(-120px, 84px);
         background: url('../../../../assets/img/A7_discover_record4.png') no-repeat center center;
         background-size: 100% 100%;
         display: flex;
@@ -106,15 +109,15 @@
         flex-direction: row;
 
         .text {
-          height: 36px;
-          line-height: 36px;
+          height: 22px;
+          line-height: 25px;
         }
       }
 
       .record5 {
         width: 102px;
         height: 25px;
-        transform: translate(-139%, -254%);
+        transform: translate(-123px, -73px);
         background: url('../../../../assets/img/A7_discover_record5.png') no-repeat center center;
         background-size: 100% 100%;
         display: flex;
@@ -128,7 +131,7 @@
 
       .point {
         height: 40px;
-        width: 40px;
+        width: 24px;
         position: absolute;
         top: 50%;
         left: 50%;
@@ -141,11 +144,11 @@
       }
 
       .point1 {
-        transform: translate(-45%, -54%);
+        transform: translate(-16%, -83%);
       }
 
       .point2 {
-        transform: translate(-26%, 176%);
+        transform: translate(-5%, 146%);
       }
     }
 
@@ -191,35 +194,35 @@
       position: relative;
 
       .point3 {
-        transform: translate(101%, 27%);
+        transform: translate(36px, 16px);
       }
 
       .point4 {
-        transform: translate(-147%, 111%);
+        transform: translate(-33px, 45px);
       }
 
       .point5 {
-        transform: translate(-208%, -106%);
+        transform: translate(-62px, -57px);
       }
 
       .arrow2 {
         width: 22px;
-        height: 58px;
+        height: 72px;
         position: absolute;
         top: 50%;
         left: 50%;
-        transform: translate(-280%, -1%);
+        transform: translate(-261%, -18%);
         background: url('../../../../assets/img/A7_discover_arrow2.png') no-repeat center center;
         background-size: 100% 100%;
       }
 
       .arrow3 {
-        width: 77px;
+        width: 57px;
         height: 28px;
         position: absolute;
         top: 50%;
         left: 50%;
-        transform: translate(-26%, 120%);
+        transform: translate(-26%, 139%);
         background: url('../../../../assets/img/A7_discover_arrow3.png') no-repeat center center;
         background-size: 100% 100%;
       }
@@ -408,8 +411,8 @@
     .left {
       .record1 {
         width: 230px;
-        height: 120px;
-        transform: translate(-79%, -118%);
+        height: 127px;
+        transform: translate(-166px, -139px);
 
         .text {
           font-size: 14px;
@@ -424,7 +427,6 @@
         padding-top: 15px;
         width: 190px;
         height: 80px;
-        transform: translate(-4%, 120%);
 
         .text {
           font-size: 14px;
@@ -451,7 +453,7 @@
         padding-top: 2px;
         width: 156px;
         height: 36px;
-        transform: translate(-119%, -206%);
+        transform: translate(-163px, -83px);
 
         .text {
           font-size: 14px;
@@ -465,11 +467,12 @@
       .record3 {
         width: 181px;
         height: 60px;
-        transform: translate(16.5%, -84%);
+        transform: translate(19px, -32px);
         padding-top: 2px;
 
         .text {
           font-size: 14px;
+          padding: 6px 0px;
         }
 
         .btn {
@@ -480,7 +483,7 @@
       .record4 {
         width: 192px;
         height: 36px;
-        transform: translate(-89.5%, 210%);
+        transform: translate(-145px, 84px);
         padding-top: 16px;
 
         .text {
@@ -491,6 +494,9 @@
           font-size: 14px;
         }
       }
+      .point4 {
+        transform: translate(-34px, 47px);
+      }
 
       .back {
         width: 90px;

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

@@ -60,6 +60,13 @@ function Discover(props: { style?: React.CSSProperties }) {
       <div className='left' style={{ opacity: isShowRecord ? 1 : 0 }}>
         <div className={classNames('leftImg', move ? 'leftImgMove' : '')}></div>
 
+        <div className='point point1' style={{ opacity: move ? 0 : 1 }}>
+          <img src={require('@/assets/img/A7_point1.png')} alt='' />
+        </div>
+        <div className='point point2' style={{ opacity: move ? 0 : 1 }}>
+          <img src={require('@/assets/img/A7_point1.png')} alt='' />
+        </div>
+
         <div className='record record1' style={{ opacity: move ? 0 : 1 }}>
           <div className='text'>
             {myData.discover.txt1Items.map((item, index) => (
@@ -91,19 +98,12 @@ function Discover(props: { style?: React.CSSProperties }) {
           </div>
         </div>
         <div className='arrow1' style={{ opacity: move ? 0 : 1 }}></div>
-        <div className='point point1' style={{ opacity: move ? 0 : 1 }}>
-          <img src={require('@/assets/img/A7_point1.png')} alt='' />
-        </div>
-        <div className='point point2' style={{ opacity: move ? 0 : 1 }}>
-          <img src={require('@/assets/img/A7_point1.png')} alt='' />
-        </div>
+
+
       </div>
       <div className={classNames('left2', isShowRecord ? '' : 'left2Ac')}>
-        {myData.discover.txt1Items.map((item, index) => (
-          <div className={`record ${'record' + (index + 3)}`} key={index}>
-            <div className='text'>{item.title}</div>
-          </div>
-        ))}
+        <div className='arrow2'></div>
+        <div className='arrow3'></div>
         <div className='point point3'>
           <img src={require('@/assets/img/A7_point1.png')} alt='' />
         </div>
@@ -113,8 +113,12 @@ function Discover(props: { style?: React.CSSProperties }) {
         <div className='point point5'>
           <img src={require('@/assets/img/A7_point1.png')} alt='' />
         </div>
-        <div className='arrow2'></div>
-        <div className='arrow3'></div>
+        {myData.discover.txt1Items.map((item, index) => (
+          <div className={`record ${'record' + (index + 3)}`} key={index}>
+            <div className='text'>{item.title}</div>
+          </div>
+        ))}
+
         <div
           className='back'
           onClick={() => {

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

@@ -22,10 +22,8 @@
         color: #7e807d;
         font-size: 16px;
         line-height: 22px;
-        letter-spacing: 2px;
         height: 90px;
         max-height: 95px;
-        overflow-y: auto;
       }
 
       .imgBox {
@@ -144,14 +142,13 @@
             &::after {
               content: '';
               width: 24px;
-              height: 4px;
+              height: 7px;
               position: absolute;
               z-index: -1;
               bottom: 0%;
               left: 50%;
               transform: translate(-65%, 10%);
-              background-color: rgba(124, 75, 54, 1);
-              box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.5);
+              background-color: #af8764;
             }
           }
 

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

@@ -13,7 +13,6 @@
   :global {
     p {
       font-size: 16px;
-      letter-spacing: 4px;
       line-height: 28px;
       text-align: center;
       color: rgba(93, 96, 96, 1);

src/pages/A7wjwj/index.module.scss

@@ -17,7 +17,7 @@
       left: 4%;
       cursor: pointer;
 
-      &>img {
+      & > img {
         height: 100%;
         object-fit: contain;
       }
@@ -53,6 +53,7 @@
           position: absolute;
           left: 50%;
           top: 50%;
+          z-index: -1;
           transform: translate(-50%, -56%);
           width: 140%;
           height: 110%;
@@ -65,18 +66,14 @@
           color: rgba(124, 75, 54, 1);
 
           &::after {
-            opacity: 1
+            opacity: 1;
           }
-
         }
       }
     }
-
-
   }
 }
 
-
 // --------移动端
 .A7WjwjMo {
   :global {
@@ -89,4 +86,4 @@
       }
     }
   }
-}
+}

src/types/declaration.d.ts

@@ -88,6 +88,7 @@ type MyDataType = {
       title: string
       fromTxt: string
     }[]
+    foxiangUrl: string
   }[]
   // 家族谱系
   genealogyIntro: {