首页需求更改

src/home/FifthEdition.jsx

@@ -95,22 +95,22 @@ function FifthEdition() {
 
   return(
     <div id={"scrollBox1"}>
-      <div style={{width:340*list.length+"px"}}>
+      <div style={{width:370*list.length+"px"}}>
-        <ul className="fifthList" id="box1" style={{width:(340*list.length)/2+"px"}}>
+        <ul className="fifthList" id="box1" style={{width:(370*list.length)/2+"px"}}>
           {
             list && list.map((i,k)=>{
               return(
-                <li><Link to={i.src}><img src={i.image_url} alt={i.name}/></Link></li>
+                <li><a href={i.src}><img src={i.image_url} alt={i.name}/></a></li>
               )
             })
           }
         </ul>
         {list.length > 10 && 
-          <ul className="fifthList" id="box2" style={{width:(340*list.length)/2+"px"}}>
+          <ul className="fifthList" id="box2" style={{width:(370*list.length)/2+"px"}}>
           {
             list && list.map((i,k)=>{
               return(
-                <li><Link to={i.src}><img src={i.image_url} alt={i.name}/></Link></li>
+                <li><a href={i.src}><img src={i.image_url} alt={i.name}/></a></li>
               )
             })
           }

src/home/Footnav.jsx

@@ -32,7 +32,9 @@ function Footnav() {
             </div> */}
             <div>
               <li>qq群</li>
-              <img src={qqImg} alt="qq群"/>
+              <div className="imgCon">
+                <img src={qqImg} alt="qq群"/>
+              </div>
             </div>
           </li>
         </ul>

src/home/Index.scss

@@ -164,7 +164,7 @@ body{
           top:0px;
           height: 100%;
           content: "";
-          transition: 1s;
+          transition: 3s;
           transition-property: width;
         }
         &.slick-active::after{
@@ -350,14 +350,14 @@ body{
             margin-top: 28px;
           }
           p{
-            font-size: 18px;
+            font-size: 20px;
-            font-weight: 500;
             color: #637497;
             line-height: 36px;
             margin-top: 50px;
             margin-bottom: 0px!important;
             span{
-              color: #1E1E1E;
+              color: #000;
+              font-weight: 500;
             }
           }
         }
@@ -458,14 +458,14 @@ body{
       }
       .highDoSubtitle{
         color: #637497;
-        font-size: 18px;
+        font-size: 20px;
-        font-weight: 500;
         line-height: 36px;
-        width: 878px;
+        max-width: 922px;
         margin:30px auto 28px;
         text-align: center;
         span{
-          color: #1F1E1E;
+          color: #000;
+          font-weight: 500;
         }
       }
       .highDoContent{
@@ -501,7 +501,7 @@ body{
           transition-delay: 1s;
         }
         .highDoBottondesc{
-          font-size: 18px;
+          font-size: 20px;
           font-weight: 500;
           color: #000000;
           line-height: 39px
@@ -586,12 +586,13 @@ body{
           margin-bottom: 70px!important;
         }
         .halfsubTitle{
-          font-size: 18px;
+          font-size: 20px;
           font-weight: 500;
           line-height: 36px;
-          color: #1E1E1E;
+          color: #000;
           span{
             color: #637497;
+            font-weight: normal;
           }
         }
       }
@@ -626,14 +627,15 @@ body{
         transition: 3s;
       }
       p{
-        max-width: 345px;
+        max-width: 422px;
         text-align: left;
-        font-size: 18px;
         font-weight: 500;
         line-height: 32px;
-        color: #1E1E1E;
+        color: #000;
+        font-size: 20px;
         span{
           color: #637497;
+          font-weight: normal;
         }
         &:first-child{
           margin-bottom: 55px!important;
@@ -907,7 +909,7 @@ body{
     margin-bottom: 54px;
   }
   #scrollBox1{
-    max-height: 300px;
+    max-height: 332px;
     overflow: hidden;
     margin: 35px 0px 0px;
     width: 100%;
@@ -916,30 +918,39 @@ body{
     display: flex;
     flex-wrap: wrap;
     flex-direction: column;
-    height: 300px;
+    height: 332px;
     width: 100%;
     float: left;
     li{
       border-bottom: none;
-      width: 300px;
+      width: 320px;
-      height: 120px;
+      height: 130px;
-      margin:15px 20px!important;
+      margin:15px 0px!important;
-      background: #fff;
+      display: flex;
-      box-shadow: 0px 1px 10px 3px rgba(0, 0, 0, 0.06);
+      justify-content: center;
-      border-radius: 4px;
+      align-items: center;
-      border: 2px solid #FFFFFF;
       &:nth-child(2n){
-        margin:15px 0px 15px 40px!important;
+        margin:12px 0px 12px 30px!important;
       }
       &:nth-child(2n+1){
-        margin:15px 40px 15px 0px!important;
+        margin:12px 30px 12px 0px!important;
+      }
+      &:hover a{
+        width: 100%;
+        height: 100%;
+        box-shadow: 0px 1px 15px 7px rgba(0, 0, 0, 0.08);
       }
       a{
+        width: 300px;
+        height: 120px;
+        background: #fff;
+        box-shadow: 0px 1px 10px 3px rgba(0, 0, 0, 0.06);
+        border-radius: 4px;
+        border: 2px solid #FFFFFF;
         display: flex;
         align-items: center;
         justify-content: center;
-        width: 100%;
+        transition:.2s;
-        height: 100%;
       }
       img{
         max-width: 100%;
@@ -1002,10 +1013,14 @@ body{
         }
         &.theline{
           display: flex;
+          .imgCon{
+            padding:5px;
+            background-color: #fff;
+            border-radius: 3px;
+          }
           img{
             width: 80px;
             height: 80px;
-            border-radius: 3px;
           }
         }
       }

src/home/SecondEdition.jsx

@@ -189,7 +189,7 @@ function SecondEdition({setValue}) {
               <p className="halfTitle">多维度用户画像</p>
               <p className="halfsubTitle"><span>实时采集和分析平台中的各类开源资源数<br/>据，</span>搭建多维度用户画像评估系统；</p>
             </div>
-            <div style={{width:"820px",marginLeft:"40px"}}>
+            <div style={{width:"820px",marginLeft:"34px"}}>
               <img src={ImgM4} alt="" width="820px" />
             </div>
           </div>

src/home/TopEdition.jsx

@@ -3,10 +3,11 @@ import Slider from 'react-slick';
 let setting={
   dots:true,
   infinite: true,
-  speed: 1000,
+  speed: 3000,
   slidesToShow: 1,
   slidesToScroll: 1,
   pauseOnDotsHover:true,
+  autoplaySpeed:0,
   pauseOnFocus:true,
   autoplay:true,
   arrows:true,