up

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

@@ -48,7 +48,7 @@
       font-weight: lighter;
 
       .t1 {
-        font-size: 16px;
+        font-size: 18px;
       }
 
       .line1 {
@@ -63,7 +63,7 @@
 
       .t2 {
         width: 90%;
-        font-size: 13px;
+        font-size: 16px;
         letter-spacing: 0.5px;
         text-align: justify;
       }
@@ -74,43 +74,39 @@
       left: 50%;
       top: 50%;
       transform: translate(-50%, -50%);
-      height: 60px;
-      width: 62px;
+      width: 80px;
+      height: 80px;
       display: flex;
       justify-content: center;
       align-items: center;
 
-      .addtxt {
-        width: 2px;
-        line-height: 9px;
-        font-size: 8px;
-      }
+
 
       &>img {
-        height: 60px;
-        width: 60px;
+        width: 100%;
+        height: 100%;
         object-fit: contain;
       }
     }
 
     .ft {
       cursor: pointer;
-      transform: translate(-66%, 50%);
+      transform: translate(-55%, 28%);
     }
 
     .fd {
       cursor: pointer;
-      transform: translate(189%, 243%);
+      transform: translate(145%, 151%);
     }
 
     .yx {
       cursor: pointer;
-      transform: translate(493%, 90%);
+      transform: translate(379%, 49%);
     }
 
     .gy {
       cursor: pointer;
-      transform: translate(523%, -139%);
+      transform: translate(404%, -121%);
     }
   }
 }
@@ -133,8 +129,8 @@
       background-size: 100% 94%;
 
       .back {
-        width: 60px;
-        height: 30px;
+        width: 80px;
+        height: 40px;
         position: absolute;
         top: 3%;
         left: 4%;
@@ -142,7 +138,7 @@
 
         &>img {
           height: 100%;
-          object-fit: contain;
+          object-fit: fill !important;
         }
       }
 
@@ -157,28 +153,35 @@
       }
 
       .detailTitle {
-        transform: translate(86%, -5%);
-        width: 65px;
-        height: 168px;
+        transform: translate(30%, 0%);
+        width: 80px;
+        height: auto;
         display: flex;
         justify-content: center;
+        position: relative;
 
         .name {
           width: 50%;
-          height: 240px;
+          height: auto;
+          font-size: 18px;
+          padding: 23px 10px 46px 10px;
           background: url('../../../assets/img/A6_zaoxiang_name_bg.png') no-repeat center center;
           background-size: 100% 100%;
           color: #ffe8b5;
-          font-size: 17px;
           font-weight: lighter;
-          padding-top: 25px;
           text-align: center;
           font-weight: 700;
         }
 
         .txt {
-          width: 20px;
-          height: 100%;
+
+          position: absolute;
+          top: 10px;
+          left: 60px;
+          padding-top: 14px;
+          width: 30px;
+          height: auto;
+
           display: flex;
           flex-direction: column;
           justify-content: flex-end;
@@ -189,8 +192,8 @@
 
           .icon1,
           .icon2 {
-            width: 20px;
-            height: 20px;
+            width: 30px;
+            height: 30px;
 
             &>img {
               height: 100%;
@@ -201,8 +204,10 @@
           .text {
             width: 100%;
             height: fit-content;
-            line-height: 14px;
             text-align: center;
+            font-size: 16px;
+            line-height: 28px;
+            writing-mode: vertical-lr;
           }
         }
       }
@@ -212,10 +217,11 @@
         height: fit-content;
         max-height: 60px;
         transform: translate(-98%, -190%);
-        font-size: 13px;
+        font-size: 16px;
         color: rgba(93, 96, 96, 1);
-        line-height: 22px;
         text-align: justify;
+        letter-spacing: 2px;
+        line-height: 24px;
       }
 
       .preview {
@@ -251,12 +257,13 @@
           .txt {
             margin-left: 20px;
             width: 25px;
-            height: 80px;
-            font-size: 10px;
             line-height: 18px;
             color: rgba(175, 135, 100, 1);
             text-align: center;
             writing-mode: vertical-rl;
+            height: auto;
+            font-size: 14px;
+            letter-spacing: 2px;
           }
 
           .icon3 {
@@ -297,127 +304,3 @@
 
 
 //--------移动端
-.ZaoxiangMo {
-  :global {
-    .back {
-      width: 80px;
-      height: 40px;
-
-      img {
-        object-fit: fill !important;
-      }
-    }
-
-    .zaoxiang_text {
-      .t1 {
-        font-size: 18px;
-      }
-
-      .t2 {
-        font-size: 16px;
-      }
-    }
-
-    .dot {
-      width: 70px;
-      height: 72px;
-
-      img {
-        width: 70px;
-        height: 70px;
-      }
-
-      .addtxt {
-        font-size: 14px;
-        line-height: 16px;
-      }
-    }
-
-    .ft {
-      transform: translate(-68%, 34%);
-    }
-
-    .fd {
-      transform: translate(160%, 170%);
-    }
-
-    .yx {
-      transform: translate(430%, 65%);
-    }
-
-    .gy {
-      transform: translate(459%, -131%);
-    }
-  }
-}
-
-.detailPageMo {
-  :global {
-
-    .detailpageContent {
-      .back {
-        width: 80px;
-        height: 40px;
-
-        img {
-          object-fit: fill !important;
-        }
-      }
-
-      .detailTitle {
-        transform: translate(30%, 0%);
-        width: 80px;
-        height: auto;
-        display: flex;
-        justify-content: center;
-        position: relative;
-
-        .name {
-          height: auto;
-          font-size: 18px;
-          padding: 23px 10px 46px 10px;
-
-        }
-
-        .txt {
-          position: absolute;
-          top: 10px;
-          left: 60px;
-          padding-top: 14px;
-          width: 30px;
-          height: auto;
-
-          .icon1,
-          .icon2 {
-            width: 30px;
-            height: 30px;
-
-          }
-
-          .text {
-            font-size: 16px;
-            line-height: 28px;
-            writing-mode: vertical-lr;
-          }
-        }
-      }
-
-
-      .txtcontent{
-        font-size: 16px;
-        letter-spacing: 2px;
-        line-height: 24px;
-      }
-
-      .preview .previewItem{
-        .txt{
-          height: auto;
-          font-size: 14px;
-          letter-spacing: 2px;
-        }
-      }
-    }
-
-
-  }
-}

src/pages/A6ybwx/A6_1_zxys/index.tsx

@@ -37,20 +37,16 @@ function Zaoxiang() {
       </div>
       <div className='dot ft' onClick={() => handleDotClick('中西融合')}>
         <img src={require('@/assets/img/A6_zaoxiang_ft.png')} draggable='false' alt='' />
-        <div className='addtxt'>中西融合</div>
       </div>
 
       <div className='dot fd' onClick={() => handleDotClick('西域雕塑风格')}>
         <img src={require('@/assets/img/A6_zaoxiang_fd.png')} draggable='false' alt='' />
-        <div className='addtxt'>西域雕塑风格</div>
       </div>
       <div className='dot yx' onClick={() => handleDotClick('中国传统绘画')}>
         <img src={require('@/assets/img/A6_zaoxiang_yk.png')} draggable='false' alt='' />
-        <div className='addtxt'>中国传统绘画</div>
       </div>
       <div className='dot gy' onClick={() => handleDotClick('汉地服饰')}>
         <img src={require('@/assets/img/A6_zaoxiang_gy.png')} draggable='false' alt='' />
-        <div className='addtxt'>汉地服饰</div>
       </div>
 
       {/* 高浮雕 */}

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

@@ -398,6 +398,74 @@
           }
         }
       }
+
+    }
+
+    .left2 {
+
+      .record5 {
+        padding-top: 2px;
+        width: 156px;
+        height: 36px;
+        transform: translate(-119%, -168%);
+
+        .text {
+          font-size: 14px;
+        }
+
+        .btn {
+          font-size: 14px;
+        }
+
+      }
+
+      .record3 {
+        width: 170px;
+        height: 60px;
+        transform: translate(16.5%, -63%);
+        padding-top: 2px;
+
+
+        .text {
+          font-size: 14px;
+        }
+
+        .btn {
+          font-size: 14px;
+        }
+
+      }
+
+      .record4 {
+        width: 192px;
+        height: 36px;
+        transform: translate(-89.5%, 186%);
+        padding-top: 6px;
+
+
+        .text {
+          font-size: 14px;
+        }
+
+        .btn {
+          font-size: 14px;
+        }
+
+      }
+      .back{
+        width: 90px;
+        height: 40px;
+        .txt{
+          font-size: 16px;
+        }
+      }
+    }
+
+    .direct {
+      left: 1%;
+      bottom: 1%;
+      width: 80px;
+      height: 80px;
     }
   }
 }

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

@@ -2,22 +2,31 @@
   width: 100%;
   height: 100%;
   position: relative;
+
   :global {
     .mainContent {
       width: 100%;
       height: 100%;
-      padding: 100px 30px 0 30px;
+      padding: 80px 30px 0 30px;
       display: flex;
       flex-direction: column;
       align-items: center;
       gap: 10px;
+
       .mainTitle {
+        text-indent: 2em;
         width: 100%;
         height: fit-content;
-        font-size: 12px;
+        font-size: 14px;
         font-weight: 500;
-        color: rgba(93, 96, 96, 1);
+        color: #7e807d;
+        font-size: 16px;
+        line-height: 22px;
+        letter-spacing: 2px;
+        height: 90px;
+        overflow-y: auto;
       }
+
       .imgBox {
         width: 100%;
         height: fit-content;
@@ -25,6 +34,7 @@
         justify-content: space-between;
         align-items: center;
         gap: 10px;
+
         .item {
           width: 24%;
           height: 220px;
@@ -34,6 +44,7 @@
           align-items: center;
           font-size: 12px;
           gap: 6px;
+
           .pic {
             width: 100%;
             height: 165px;
@@ -41,19 +52,24 @@
             background: url('../../../../assets/img/A7_shuxing_bg.png') no-repeat center center;
             background-size: 100% 100%;
             cursor: pointer;
-            & > img {
+            display: flex;
+            align-items: center;
+
+            &>img {
               width: 100%;
-              height: 95%;
+              height: 80%;
               object-fit: contain;
             }
           }
+
           .name {
-            font-size: 13px;
+            font-size: 18px;
             font-weight: 600;
             color: rgba(91, 71, 46, 1);
           }
+
           .time {
-            font-size: 12px;
+            font-size: 14px;
             font-weight: 400;
             color: rgba(91, 71, 46, 0.8);
           }
@@ -64,70 +80,89 @@
     .detailContent {
       width: 100%;
       height: 100%;
-      padding-top: 100px;
+      padding-top: 80px;
       display: flex;
       flex-direction: column;
       justify-content: space-between;
       align-items: center;
-      gap: 30px;
+      gap: 20px;
+
       .detailContainner {
-        width: 70%;
-        height: 60%;
+        width: 80%;
+        height: calc(100% - 110px);
         display: flex;
         justify-content: center;
         align-items: center;
         gap: 10px;
+
         .left {
-          width: 50%;
+          width: 52%;
           height: 100%;
           display: flex;
           flex-direction: column;
           gap: 10px;
           color: rgba(93, 96, 96, 1);
           font-size: 10px;
-          & > div {
+
+          &>div {
             display: flex;
-            align-items: center;
-            gap: 3px;
+            align-items: flex-start;
             position: relative;
-            &::after {
-              content: '';
-              position: absolute;
-              top: 10px;
-              left: 3px;
-              width: 13px;
-              height: 2px;
-              background: rgba(175, 135, 100, 1);
-            }
+            font-size: 16px;
+            text-align: justify;
+            margin: 3px 0;
+
           }
+
           .detailTitle {
+            margin-bottom: 10px;
             width: fit-content;
-            height: 20px;
-            font-size: 18px;
-            color: rgba(175, 135, 100, 1);
+            font-size: 22px;
+            letter-spacing: 2px;
+            font-weight: 700;
+            color: rgb(124, 75, 54);
+
+
             &::after {
               background: none;
             }
           }
+
           .label {
-            align-self: flex-start;
-            width: fit-content;
-            min-width: 30px;
+            position: relative;
             height: fit-content;
+            font-size: 16px;
+            font-weight: bold;
             white-space: nowrap;
+            width: 40px;
+
+            &::after {
+              content: '';
+              width: 24px;
+              height: 4px;
+              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);
+            }
           }
         }
+
         .right {
-          width: 50%;
+          width: 48%;
           height: 100%;
-          max-height: 180px;
           align-self: flex-start;
           position: relative;
-          & > img {
+
+          &>img {
             width: 80%;
             height: 100%;
             object-fit: contain;
           }
+
           .diwen {
             position: absolute;
             left: 50px;
@@ -138,26 +173,32 @@
           }
         }
       }
+
       .bottom {
         width: 100%;
         height: 90px;
-        background-color: rgba(177, 150, 123, 0.6);
+        background-image: url('../../../../assets/sgImg/img_rec.png');
+        background-size: 100% 100%;
         display: flex;
         align-items: center;
         justify-content: center;
         gap: 30px;
+
         .item {
           width: 80px;
           height: 80px;
-          background-color: rgba(177, 150, 123, 1);
+          background-image: url('../../../../assets/sgImg/img_txt.png');
+          background-size: 100% 100%;
           display: flex;
           align-items: center;
           justify-content: center;
           cursor: pointer;
+
           &.itemAc {
-            background-color: rgba(255, 212, 112, 0.7);
+            background-image: url('../../../../assets/sgImg/img_txtac.png');
           }
-          & > img {
+
+          &>img {
             width: 80%;
             height: 80%;
             object-fit: contain;
@@ -166,4 +207,4 @@
       }
     }
   }
-}
+}

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

@@ -55,7 +55,7 @@ function Shuxing({ style }:Props,ref:any) {
               <div className='detailTime'><div className="label">年代：</div>&emsp;{myData.shuxing[currentIndex].time}</div>
               <div className='detailSize'><div className="label">尺寸：</div>&emsp;{myData.shuxing[currentIndex].size}</div>
               <div className='detailDesc'><div className="label">描述：</div>&emsp;
-                {myData.shuxing[currentIndex].desc}
+                <p>{myData.shuxing[currentIndex].desc}</p>
               </div>
             </div>
             <div className='right'><img className='diwen' draggable={false} src={require(`@/assets/img/A7_diwen${currentIndex % 2 === 0 ? '1' : '2'}.png`)} alt="" /><img src={myData.shuxing[currentIndex].img} alt="" /></div>

src/pages/A7wjwj/index.module.scss

@@ -60,14 +60,17 @@
 
     // 未解之思
     .weijie {
+      overflow-y: auto;
       width: 100%;
-      height: 100%;
+      height: 98%;
       position: relative;
-      
-      padding: 100px 50px 0 50px;
+      text-indent: 2em;
+      padding: 80px 50px 0 50px;
       color: rgba(93, 96, 96, 1);
-      font-size: 13px;
-      line-height: 20px;
+      font-size: 18px;
+      letter-spacing: 2px;
+      line-height: 22px;
+      text-align: justify;
     }
   }
 }