zhangdehua 1 год назад
Родитель
Сommit
d2c09aaf4e

+ 3 - 3
app/index/view/base.html

@@ -155,7 +155,7 @@
 <!--                </div>-->
                 <div class="fLinkContainer">
                     <div class="fLinkBox">
-                        <h3 class="fLinkTitle">My Account</h3>
+                        <h3 class="fLinkTitle">My Account<span>:</span></h3>
                         <a href="/index/user/order.html">
                             <div class="fLinkItem">Personal</div>
                         </a>
@@ -167,7 +167,7 @@
                         </a>
                     </div>
                     <div class="fLinkBox">
-                        <h3 class="fLinkTitle">Polices</h3>
+                        <h3 class="fLinkTitle">Polices<span>:</span></h3>
                         <a href="/index/index/aboutUs.html">
                             <div class="fLinkItem">About Us</div>
                         </a>
@@ -251,7 +251,7 @@
                     <div class="aRImgItem">
                         <img src="/assets/index/asstes/icon/cert1.png" alt="">
                     </div>
-                    <div class="aRImgItemLast">
+                    <div class="aRImgItem">
                         <img src="/assets/index/asstes/icon/cert4.png" alt="">
                     </div>
                 </div>

+ 26 - 32
app/index/view/index/index.html

@@ -65,11 +65,11 @@
                                     </p>
                                     <p class="goodsScribe textEllipsis">${$goods['line_price_max']}</p>
                                 </div>
-<!--                                <div class="goodsCollect">-->
-<!--                                    <img src="/assets/index/asstes/icon/gsCollect.png" alt="collect"-->
-<!--                                         title="collect">-->
-<!--                                    <p class="collectNumber textEllipsis">99</p>-->
-<!--                                </div>-->
+                                <!--                                <div class="goodsCollect">-->
+                                <!--                                    <img src="/assets/index/asstes/icon/gsCollect.png" alt="collect"-->
+                                <!--                                         title="collect">-->
+                                <!--                                    <p class="collectNumber textEllipsis">99</p>-->
+                                <!--                                </div>-->
                             </div>
                             <div class="goodsReviews">
                                 <div class="goodsStarContainer">
@@ -123,11 +123,11 @@
                                     </p>
                                     <p class="goodsScribe textEllipsis">${$goods['line_price_max']}</p>
                                 </div>
-<!--                                <div class="goodsCollect">-->
-<!--                                    <img src="/assets/index/asstes/icon/gsCollect.png" alt="collect"-->
-<!--                                         title="collect">-->
-<!--                                    <p class="collectNumber textEllipsis">99</p>-->
-<!--                                </div>-->
+                                <!--                                <div class="goodsCollect">-->
+                                <!--                                    <img src="/assets/index/asstes/icon/gsCollect.png" alt="collect"-->
+                                <!--                                         title="collect">-->
+                                <!--                                    <p class="collectNumber textEllipsis">99</p>-->
+                                <!--                                </div>-->
                             </div>
                             <div class="goodsReviews">
                                 <div class="goodsStarContainer">
@@ -220,7 +220,7 @@
                     <div class="goodsInfo">
                         <div class="goodsTitleBox">
                             <h3 class="goodsTitle">
-                                <span class="preTag">On sale</span>
+                                <span class="preTag">New</span>
                                 <span class="tText">{$deal['goods_name']}</span>
                             </h3>
                         </div>
@@ -228,10 +228,10 @@
                             <p class="goodsPrice textEllipsis">
                                 <span>$</span>{$deal['goods_price_min']}
                             </p>
-<!--                            <div class="goodsCollect">-->
-<!--                                <img src="/assets/index/asstes/icon/gsCollect.png" alt="collect" title="collect">-->
-<!--                                <p class="collectNumber textEllipsis">99</p>-->
-<!--                            </div>-->
+                            <!--                            <div class="goodsCollect">-->
+                            <!--                                <img src="/assets/index/asstes/icon/gsCollect.png" alt="collect" title="collect">-->
+                            <!--                                <p class="collectNumber textEllipsis">99</p>-->
+                            <!--                            </div>-->
                         </div>
                         <div class="goodsReviews">
                             <div class="goodsStarContainer">
@@ -275,7 +275,7 @@
                     <div class="goodsInfo">
                         <div class="goodsTitleBox">
                             <h3 class="goodsTitle">
-                                <span class="preTag">On sale</span>
+                                <span class="preTag">New</span>
                                 <span class="tText">{$deal['goods_name']}</span>
                             </h3>
                         </div>
@@ -283,10 +283,10 @@
                             <p class="goodsPrice textEllipsis">
                                 <span>$</span>{$deal['goods_price_min']}
                             </p>
-<!--                            <div class="goodsCollect">-->
-<!--                                <img src="/assets/index/asstes/icon/gsCollect.png" alt="collect" title="collect">-->
-<!--                                <p class="collectNumber textEllipsis">99</p>-->
-<!--                            </div>-->
+                            <!--                            <div class="goodsCollect">-->
+                            <!--                                <img src="/assets/index/asstes/icon/gsCollect.png" alt="collect" title="collect">-->
+                            <!--                                <p class="collectNumber textEllipsis">99</p>-->
+                            <!--                            </div>-->
                         </div>
                         <div class="goodsReviews">
                             <div class="goodsStarContainer">
@@ -322,28 +322,22 @@
         <h2 class="partnersTitle">Partners</h2>
         <div class="partnersList">
             <div class="partnersItem">
-                <img class="partnersLogo lazy" src="/assets/index/asstes/icon/transparent.png"
-                     data-original="/assets/index/asstes/icon/p1.jpg" alt="">
+                <img class="partnersLogo" src="/assets/index/asstes/logo/logo_dhl.png" alt="">
             </div>
             <div class="partnersItem">
-                <img class="partnersLogo lazy" src="/assets/index/asstes/icon/transparent.png"
-                     data-original="/assets/index/asstes/icon/p2.jpg" alt="">
+                <img class="partnersLogo" src="/assets/index/asstes/logo/logo_fedEx.png" alt="">
             </div>
             <div class="partnersItem">
-                <img class="partnersLogo lazy" src="/assets/index/asstes/icon/transparent.png"
-                     data-original="/assets/index/asstes/icon/p3.jpg" alt="">
+                <img class="partnersLogo" src="/assets/index/asstes/logo/logo_ls.png" alt="">
             </div>
             <div class="partnersItem">
-                <img class="partnersLogo lazy" src="/assets/index/asstes/icon/transparent.png"
-                     data-original="/assets/index/asstes/icon/p4.jpg" alt="">
+                <img class="partnersLogo" src="/assets/index/asstes/logo/logo_payPal.png" alt="">
             </div>
             <div class="partnersItem">
-                <img class="partnersLogo lazy" src="/assets/index/asstes/icon/transparent.png"
-                     data-original="/assets/index/asstes/icon/p5.jpg" alt="">
+                <img class="partnersLogo" src="/assets/index/asstes/logo/logo_ups.png" alt="">
             </div>
             <div class="partnersItem">
-                <img class="partnersLogo lazy" src="/assets/index/asstes/icon/transparent.png"
-                     data-original="/assets/index/asstes/icon/p5.jpg" alt="">
+                <img class="partnersLogo" src="/assets/index/asstes/logo/logo_le.png" alt="">
             </div>
         </div>
     </div>

BIN
public/assets/index/asstes/logo/logo_dhl.png


BIN
public/assets/index/asstes/logo/logo_fedEx.png


BIN
public/assets/index/asstes/logo/logo_le.png


BIN
public/assets/index/asstes/logo/logo_ls.png


BIN
public/assets/index/asstes/logo/logo_payPal.png


BIN
public/assets/index/asstes/logo/logo_ups.png


+ 334 - 176
public/assets/index/css/common.css

@@ -1,4 +1,4 @@
-*{
+* {
     margin: 0;
     padding: 0;
 }
@@ -7,23 +7,25 @@ html {
     -webkit-text-size-adjust: 100%;
     -ms-text-size-adjust: 100%;
     /* 解决IOS默认滑动很卡的情况 */
-    -webkit-overflow-scrolling : touch;
+    -webkit-overflow-scrolling: touch;
 }
-body{
+
+body {
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
     font-size: .16rem;
-}    
+}
+
 /* 禁止缩放表单 */
 input[type="submit"], input[type="reset"], input[type="button"], input {
     resize: none;
     border: none;
 }
 
-ol,li,ul,dl,dt,dd{
-    list-style:none;
+ol, li, ul, dl, dt, dd {
+    list-style: none;
 }
 
-img{
+img {
     height: auto;
     object-fit: cover;
 }
@@ -33,43 +35,46 @@ em, i {
 }
 
 textarea {
-    resize:none;
+    resize: none;
 }
 
 p {
-    word-wrap:break-word; 
+    word-wrap: break-word;
 }
-a{
+
+a {
     text-decoration: none;
     color: inherit;
     outline: none;
     -moz-outline-style: none;
 }
+
 a:active, a:focus {
     outline: none;
 }
 
-.textEllipsis{
+.textEllipsis {
     text-overflow: ellipsis;
     white-space: nowrap;
     overflow: hidden;
 }
 
-.sectionContainer{
+.sectionContainer {
     display: flex;
     justify-content: center;
 }
-.elementorContainer{
-    max-width: 13.2rem; 
+
+.elementorContainer {
+    max-width: 13.2rem;
     flex: 1;
     -moz-box-sizing: border-box;
-    -webkit-box-sizing: border-box; 
+    -webkit-box-sizing: border-box;
     box-sizing: border-box;
 }
 
 
 /* <-- start 头部模块 */
-.headerContainer{
+.headerContainer {
     width: 100%;
     background-color: #FFF;
     position: sticky;
@@ -77,18 +82,20 @@ a:active, a:focus {
     left: 0;
     right: 0;
     z-index: 99;
-    -webkit-box-shadow: 0 .02rem .05rem rgba(0,0,0,.03);
-    box-shadow: 0 .02rem .05rem rgba(0,0,0,.03);
+    -webkit-box-shadow: 0 .02rem .05rem rgba(0, 0, 0, .03);
+    box-shadow: 0 .02rem .05rem rgba(0, 0, 0, .03);
 }
-.warnContainer{
-    background-color: #434344; 
+
+.warnContainer {
+    background-color: #434344;
     width: 100%;
     height: .5rem;
     display: flex;
     align-items: center;
     justify-content: center;
 }
-.warnContainer .warnText{
+
+.warnContainer .warnText {
     max-width: 13.2rem;
     word-break: break-all;
     line-height: 1.4;
@@ -96,8 +103,9 @@ a:active, a:focus {
     font-size: .16rem;
     color: rgba(255, 255, 255, .7);
 }
+
 /* PC端头部 */
-#computerEndHeader{
+#computerEndHeader {
     width: 13.2rem;
     height: .7rem;
     margin: 0 auto;
@@ -106,17 +114,20 @@ a:active, a:focus {
     align-items: center;
     cursor: pointer;
 }
-#computerEndHeader .computerLogo{
+
+#computerEndHeader .computerLogo {
     color: rgba(79, 73, 222, 1);
     font-weight: bold;
     font-size: .28rem;
     padding-right: .5rem;
 }
-#computerEndHeader .computerLogo img{
+
+#computerEndHeader .computerLogo img {
     height: .36rem;
     width: auto;
 }
-.headNavContainer{
+
+.headNavContainer {
     flex: 1;
     display: flex;
     align-items: center;
@@ -124,7 +135,8 @@ a:active, a:focus {
     overflow: hidden;
 
 }
-.headNavItem{
+
+.headNavItem {
     height: .7rem;
     display: flex;
     align-items: center;
@@ -132,7 +144,8 @@ a:active, a:focus {
     position: relative;
     margin-right: .36rem;
 }
-.headNavItem .headNavTitle{
+
+.headNavItem .headNavTitle {
     padding: 0 .28rem;
     font-weight: bold;
     color: #333333;
@@ -143,11 +156,12 @@ a:active, a:focus {
     min-width: 1.5rem;
 }
 
-.headNavItem.active .headNavTitle{
+.headNavItem.active .headNavTitle {
     color: #FFFFFF;
     font-size: .24rem;
 }
-.headNavItem.active .back{
+
+.headNavItem.active .back {
     position: absolute;
     width: 100%;
     height: 116%;
@@ -157,59 +171,69 @@ a:active, a:focus {
     background-color: rgba(79, 73, 222, 1);
     z-index: 1;
 }
-.headIconContainer{
+
+.headIconContainer {
     display: flex;
     align-items: center;
     height: 100%;
 }
-.headIconContainer .headIconItem{
+
+.headIconContainer .headIconItem {
     padding: 0 .2rem;
     height: .7rem;
     display: flex;
     align-items: center;
     justify-content: center;
 }
-.headIconContainer .headIconItem img{
+
+.headIconContainer .headIconItem img {
     height: .24rem;
 }
-.headIconContainer .headIconItem .cart img{
+
+.headIconContainer .headIconItem .cart img {
     height: .28rem;
 }
 
 
 /* 移动端头部 */
-#mobileEndHeader{
+#mobileEndHeader {
     display: none;
     position: relative;
 }
-.mobileEndHeaderConten{
+
+.mobileEndHeaderConten {
     padding: 0 .24rem;
-    height:.9rem;
+    height: .9rem;
     display: flex;
     flex: 1;
     align-items: center;
     justify-content: space-between;
 }
-.mobileEndHeaderConten .mobileLogo{
+
+.mobileEndHeaderConten .mobileLogo {
     color: rgba(79, 73, 222, 1);
     font-weight: bold;
     font-size: .28rem;
     padding-right: .5rem;
 }
-.mobileEndHeaderConten .mobileLogo img{
+
+.mobileEndHeaderConten .mobileLogo img {
     height: .4rem;
-    width: auto; 
+    width: auto;
 }
-.mobileUserIconList{
+
+.mobileUserIconList {
     display: flex;
     flex: 1;
     align-items: center;
     justify-content: flex-end;
     padding-right: .24rem;
-}   
-.mobileUserIcon img{
+}
+
+.mobileUserIcon img {
     height: .3rem;
 }
+
 #mobileMenuBot {
     height: .4rem;
     display: flex;
@@ -224,6 +248,7 @@ a:active, a:focus {
     background-color: #666666;
     border-radius: .08rem;
 }
+
 #mobileMenuLink:before,
 #mobileMenuLink:after {
     content: '';
@@ -274,10 +299,11 @@ a:active, a:focus {
 .open #mobileMenuLink:after {
     background: #666666;
 }
-.mobileMenuFixed{
-    position: absolute; 
+
+.mobileMenuFixed {
+    position: absolute;
     background: white;
-    border-radius: .12rem; 
+    border-radius: .12rem;
     min-width: 3rem;
     max-width: 5rem;
     padding: .12rem .24rem;
@@ -286,13 +312,16 @@ a:active, a:focus {
     z-index: 999;
     display: none;
 }
-.mobileMenuItem{
+
+.mobileMenuItem {
     border-bottom: .01rem solid #dfdfdf;
 }
-.mobileMenuFixed .mobileMenuItem:last-child{
+
+.mobileMenuFixed .mobileMenuItem:last-child {
     border: none;
 }
-.mobileMenuItem .menuItemTitle{
+
+.mobileMenuItem .menuItemTitle {
     height: .8rem;
     display: flex;
     align-items: center;
@@ -300,15 +329,17 @@ a:active, a:focus {
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
-    color: #434343; 
+    color: #434343;
 }
-.mobileMenuItem.active .menuItemTitle{
+
+.mobileMenuItem.active .menuItemTitle {
     color: rgba(79, 73, 222, 1);
 }
+
 /* end 头部模块 --> */
 
 /* start 年龄提示模块 --> */
-.maskContainer{
+.maskContainer {
     position: fixed;
     width: 100vw;
     height: 100vh;
@@ -320,7 +351,8 @@ a:active, a:focus {
     background-color: rgba(0, 0, 0, .5);
     display: none;
 }
-.ageReminderBox{
+
+.ageReminderBox {
     width: 7rem;
     background-color: #FFF;
     height: 3.8rem;
@@ -329,7 +361,8 @@ a:active, a:focus {
     top: 30%;
     position: absolute;
 }
-.ageReminderBack{
+
+.ageReminderBack {
     position: absolute;
     z-index: 1;
     height: 100%;
@@ -337,26 +370,29 @@ a:active, a:focus {
     top: 0;
     left: 0;
 }
-.ageReminderInfo{
+
+.ageReminderInfo {
     position: relative;
     z-index: 2;
     margin-left: .32rem;
     padding-top: 1rem;
     color: #fff;
 }
-.ageReminderInfo h3{
+
+.ageReminderInfo h3 {
     line-height: 1.4;
     font-size: .36rem;
     max-width: 60%;
     font-weight: bold;
 }
 
-.ageReminderInfo .ageReminderButBox{
+.ageReminderInfo .ageReminderButBox {
     display: flex;
     align-items: center;
     padding-top: .32rem;
 }
-.ageReminderInfo .ageReminderButBox .ageRBut{
+
+.ageReminderInfo .ageReminderButBox .ageRBut {
     color: rgba(237, 109, 244, 1);
     background-color: #fff;
     display: flex;
@@ -371,46 +407,54 @@ a:active, a:focus {
     margin-right: .32rem;
     cursor: pointer;
 }
+
 /* end 年龄提示模块 --> */
 
 /* <-- start 底部模块 */
-.footerContainer{
+.footerContainer {
     width: 100%;
     background-color: rgba(32, 32, 32, 1);
     position: relative;
     z-index: 10;
 }
-.warningContainer{
+
+.warningContainer {
     background-color: gray;
 }
-.warningBox{
+
+.warningBox {
     padding: .16rem 0;
     color: rgba(255, 255, 255, .8);
     font-size: .15rem;
     line-height: 1.4;
 }
-.footerConter{
+
+.footerConter {
     color: #FFF;
     padding-top: .3rem;
     padding-bottom: .24rem;
     display: flex;
 }
-.leftText{
-    max-width: 2rem;
+
+.leftText {
+    max-width: 7rem;
     margin-right: .8rem;
 }
-.leftText .ltK{
+
+.leftText .ltK {
     font-weight: bold;
     font-size: .18rem;
     word-break: break-all;
     padding-bottom: .06rem;
 }
-.leftText .ltV{
+
+.leftText .ltV {
     font-size: .14rem;
     color: rgba(255, 255, 255, .6);
     word-break: break-all;
 }
-.footerInuptBox{
+
+.footerInuptBox {
     background: #FFF;
     flex: 1;
     height: .5rem;
@@ -421,123 +465,154 @@ a:active, a:focus {
     max-width: 5rem;
     margin-right: 1.5rem;
 }
-.footerInuptBox .mailIcon{
+
+.footerInuptBox .mailIcon {
     width: .38rem;
     height: .38rem;
 }
-.footerInupt{
+
+.footerInupt {
     flex: 1;
     height: 100%;
     outline: none;
     font-size: .18rem;
     margin: 0 .12rem;
 }
-.footerInuptBox .arrowIcon{
+
+.footerInuptBox .arrowIcon {
     height: .19rem;
     width: auto;
 }
-.fLinkContainer{
+
+.fLinkContainer {
     flex: 1;
     display: flex;
     justify-content: flex-end;
     padding-right: .5rem;
 }
-.fLinkBox{
+
+.fLinkBox {
     padding: 0 .24rem;
 }
-.fLinkTitle{
+
+.fLinkTitle {
     font-size: .15rem;
     color: #666666;
     font-weight: 400;
     margin-bottom: .04rem;
 }
-.fLinkItem{
+
+.fLinkTitle span {
+    display: none;
+}
+
+.fLinkItem {
     font-size: .14rem;
     color: #fff;
     padding: .02rem 0;
     cursor: pointer;
 }
-.footerIconContainer{
+
+.footerIconContainer {
     max-width: 4rem;
 }
-.footerIconList{
+
+.footerIconList {
     overflow-x: scroll;
     white-space: nowrap;
 }
+
 .footerIconList::-webkit-scrollbar {
     display: none;
 }
-.footerIconItem{
+
+.footerIconItem {
     margin-right: .1rem;
     display: inline-flex;
 }
-.footerIconItem img{
+
+.footerIconItem img {
     width: .48rem;
-    height: .48rem; 
+    height: .48rem;
     border-radius: 50%;
 }
-.footerVlsaImg{
+
+.footerVlsaImg {
     display: flex;
     flex-wrap: wrap;
     padding-top: .1rem;
 }
-.footerVlsaItem{
+
+.footerVlsaItem {
     font-size: 0;
 }
-.footerVlsaImg img{
+
+.footerVlsaImg img {
     width: .4rem;
     height: .26rem;
 }
-.acceptContainer{
+
+.acceptContainer {
     background-color: #fff;
 }
-.acceptBox{
+
+.acceptBox {
     display: flex;
     justify-content: space-between;
     padding: .16rem 0;
 }
-.acceptLeftInfo{
+
+.acceptLeftInfo {
     max-width: 3.6rem;
 }
-.acceptLeftInfo .weAcc{
+
+.acceptLeftInfo .weAcc {
     font-size: .14rem;
     color: #434343;
 }
-.aLImgBox{
+
+.aLImgBox {
     display: flex;
     flex-wrap: wrap;
     gap: .08rem;
     padding-top: .08rem;
 }
-.aLImgItem{
+
+.aLImgItem {
     font-size: 0;
 }
-.aLImgItem img{
+
+.aLImgItem img {
     width: 2.5rem;
     height: .3rem;
 }
-.weText{
+
+.weText {
     font-size: .14rem;
     color: #434343;
     line-height: 1.4;
     word-break: break-all;
     padding-top: .3rem;
 }
-.acceptRightInfo{
+
+.acceptRightInfo {
     display: flex;
-    flex-wrap: wrap; 
+    flex-wrap: wrap;
     justify-content: flex-end;
     gap: .16rem;
     flex: 1;
     padding-left: .24rem;
 }
-.aRImgItem{
+
+.aRImgItem {
     font-size: 0;
 }
-.aRImgItem img{
+
+.aRImgItem img {
     width: 1.3rem;
     height: .7rem;
 }
+
 #toastContainer {
     position: fixed;
     top: 40%;
@@ -557,35 +632,38 @@ a:active, a:focus {
 }
 
 
-
 /* <-- start 个人中心菜单 */
-.navContainer{
+.navContainer {
     background-color: #E8EEF6;
     width: 3.4rem;
     padding-bottom: 1rem;
     -moz-box-sizing: border-box;
-    -webkit-box-sizing: border-box; 
+    -webkit-box-sizing: border-box;
     box-sizing: border-box;
 }
-.navItem{
+
+.navItem {
     padding-left: .24rem;
     cursor: pointer;
 }
-.navItem .navItemFlex{
+
+.navItem .navItemFlex {
     display: flex;
     align-items: center;
     height: .6rem;
     padding-right: .22rem;
 }
-.navItem .navItemFlex.active .navTitle{
+
+.navItem .navItemFlex.active .navTitle {
     color: #fff;
     background-color: rgba(79, 73, 222, 1);
 }
-.navItem .navItemFlex img{
+
+.navItem .navItemFlex img {
     width: .4rem;
 }
 
-.navItem .navItemFlex .navTitle{
+.navItem .navItemFlex .navTitle {
     font-weight: 400;
     color: #434343;
     font-size: .17rem;
@@ -599,11 +677,13 @@ a:active, a:focus {
     white-space: nowrap;
     overflow: hidden;
 }
-.sunNavBox{
+
+.sunNavBox {
     margin-left: .4rem;
     padding-right: .22rem;
 }
-.sunNavItem{
+
+.sunNavItem {
     height: .5rem;
     display: flex;
     align-items: center;
@@ -612,7 +692,8 @@ a:active, a:focus {
     border-radius: .04rem;
     margin: .05rem 0;
 }
-.sunNavItem .sunNavTitle{
+
+.sunNavItem .sunNavTitle {
     font-weight: 400;
     font-size: .17rem;
     text-overflow: ellipsis;
@@ -620,251 +701,328 @@ a:active, a:focus {
     overflow: hidden;
     flex: 1;
 }
-.sunNavItem.active{
+
+.sunNavItem.active {
     color: #fff;
     background-color: rgba(79, 73, 222, 1);
 }
+
 /* end 个人中心菜单 --> */
 
 
 @media (max-width: 1499px) {
-    .navContainer{
+    .navContainer {
         width: 3rem;
     }
-    .navItem{
+
+    .navItem {
         padding-left: .16rem;
     }
-    .navItem .navItemFlex{
+
+    .navItem .navItemFlex {
         padding-right: .16rem;
     }
-    .navItem .navItemFlex img{
+
+    .navItem .navItemFlex img {
         width: .34rem;
     }
-    .navItem .navItemFlex .navTitle{
+
+    .navItem .navItemFlex .navTitle {
         height: .46rem;
         font-size: .16rem;
     }
-    .sunNavBox{
+
+    .sunNavBox {
         margin-left: .34rem;
         padding-right: .16rem;
     }
-    .sunNavItem{
+
+    .sunNavItem {
         height: .46rem;
     }
-    .sunNavItem .sunNavTitle{
+
+    .sunNavItem .sunNavTitle {
         font-size: .16rem;
     }
-    .navContainer{
+
+    .navContainer {
         padding-bottom: .5rem;
     }
 }
+
 @media (max-width: 1320px) {
-    #computerEndHeader{
+    #computerEndHeader {
         width: auto;
     }
-    .computerLogo{
+
+    .computerLogo {
         margin-left: .12rem;
     }
-    .headIconContainer{
+
+    .headIconContainer {
         margin-right: .12rem;
     }
-    .headNavItem .headNavTitle{
+
+    .headNavItem .headNavTitle {
         font-size: .22rem;
     }
-    .headNavItem.active .headNavTitle{
+
+    .headNavItem.active .headNavTitle {
         font-size: .26rem;
     }
 }
+
 @media (max-width: 1199px) {
-    .warnContainer{
+    .warnContainer {
         height: auto;
     }
-    .warnContainer .warnText{
+
+    .warnContainer .warnText {
         font-size: .2rem;
         padding: .06rem .24rem;
     }
-    #computerEndHeader{
+
+    #computerEndHeader {
         display: none;
     }
-    #mobileEndHeader{
+
+    #mobileEndHeader {
         display: flex;
     }
-    .footerContainer{
+
+    .footerContainer {
         height: auto;
     }
-    .footerConter{
+
+    .footerConter {
         display: block;
         padding: .24rem .12rem;
     }
-    .leftText{
+
+    .leftText {
         max-width: none;
         margin-right: 0;
         margin-bottom: .32rem;
     }
-    .leftText .ltK{
+
+    .leftText .ltK {
         font-size: .2rem;
     }
-    .leftText .ltV{
+
+    .leftText .ltV {
         font-size: .18rem;
     }
-    .footerInuptBox{
+
+    .footerInuptBox {
         max-width: 6rem;
         margin-right: 0;
         height: .6rem;
         margin-bottom: .32rem;
     }
-    .footerIconContainer{
+
+    .footerIconContainer {
         max-width: none;
     }
-    .footerIconList{
+
+    .footerIconList {
         white-space: normal;
         overflow-x: hidden;
         display: flex;
         flex-wrap: wrap;
         margin-bottom: .12rem;
     }
-    .footerIconItem{
+
+    .footerIconItem {
         display: block;
         margin-right: .24rem;
     }
-    .acceptBox{
+
+    .acceptBox {
         display: block;
     }
-    .acceptLeftInfo{
+
+    .acceptLeftInfo {
         max-width: none;
     }
-    .acceptLeftInfo .weAcc{
+
+    .acceptLeftInfo .weAcc {
         font-size: .16rem;
     }
-    .aLImgItem img{
+
+    .aLImgItem img {
         width: .6rem;
         height: .35rem;
     }
-    .weText{
+
+    .weText {
         font-size: .16rem;
     }
-    .acceptRightInfo{
+
+    .acceptRightInfo {
         justify-content: flex-start;
         padding-left: 0;
         padding-top: .4rem;
     }
-    .fLinkContainer{
-        justify-content: flex-start;
+
+    .fLinkContainer {
         padding-right: 0;
         margin-bottom: .4rem;
+        display: block;
     }
-    .fLinkBox{
+
+    .fLinkBox {
         padding: 0;
         margin-right: .4rem;
+        display: flex;
+        align-items: baseline;
+        flex-wrap: wrap;
+        padding-top: .12rem;
+        gap: .08rem .16rem;
     }
-    .fLinkTitle{
+
+    .fLinkTitle {
         font-size: .2rem;
+        margin-bottom: 0;
+    }
+
+    .fLinkTitle span {
+        display: inline-block;
     }
-    .fLinkItem{
+
+    .fLinkItem {
         font-size: .18rem;
     }
 }
+
 @media (max-width: 999px) {
-    .navContainer{
+    .navContainer {
         width: 2.4rem;
     }
 }
+
 @media (max-width: 899px) {
-    .ageReminderBox{
+    .ageReminderBox {
         width: 6rem;
         height: 3rem;
     }
-    .ageReminderInfo{
+
+    .ageReminderInfo {
         padding-top: .6rem;
     }
-    .ageReminderInfo h3{
+
+    .ageReminderInfo h3 {
         font-size: .3rem;
     }
-    .ageReminderInfo .ageReminderButBox .ageRBut{
+
+    .ageReminderInfo .ageReminderButBox .ageRBut {
         font-size: .2rem;
         min-width: 1rem;
     }
 
-    .leftText .ltK{
+    .leftText .ltK {
         font-size: .22rem;
     }
-    .leftText .ltV{
+
+    .leftText .ltV {
         font-size: .2rem;
     }
 
-    .footerIconItem img{
+    .footerIconItem img {
         width: .5rem;
         height: .5rem;
     }
-    .footerVlsaImg img{
+
+    .footerVlsaImg img {
         height: .4rem;
     }
-    #toastContainer{
+
+    #toastContainer {
         font-size: .24rem;
         padding: .1rem .16rem;
     }
-    .footerConter{
+
+    .footerConter {
         padding: .24rem;
     }
 }
+
 @media (max-width: 750px) {
-    .navContainer{
+    .navContainer {
         width: 2.2rem;
     }
-    .navItem{
+
+    .navItem {
         padding-left: .12rem;
     }
-    .navItem .navItemFlex{
+
+    .navItem .navItemFlex {
         padding-right: .12rem;
     }
-    .navItem .navItemFlex img{
+
+    .navItem .navItemFlex img {
         width: .34rem;
     }
-    .navItem .navItemFlex .navTitle{
+
+    .navItem .navItemFlex .navTitle {
         height: .6rem;
         font-size: .2rem;
     }
-    .sunNavBox{
+
+    .sunNavBox {
         margin-left: .34rem;
         padding-right: .12rem;
     }
-    .sunNavItem{
+
+    .sunNavItem {
         height: .6rem;
     }
-    .sunNavItem .sunNavTitle{
+
+    .sunNavItem .sunNavTitle {
         font-size: .2rem;
     }
-    .warningBox{
+
+    .warningBox {
         font-size: .2rem;
     }
-    .acceptBox{
+
+    .acceptBox {
         display: block;
     }
-    .acceptLeftInfo{
+
+    .acceptLeftInfo {
         max-width: none;
+        margin-left: .5rem;
     }
-    .acceptLeftInfo .weAcc{
+
+    .acceptLeftInfo .weAcc {
         font-size: .2rem;
+        text-align: center;
     }
-    .aLImgItem img{
+
+    .aLImgBox {
+        justify-content: center;
+    }
+
+    .aLImgItem img {
         width: 2.7rem;
         height: .4rem;
     }
-    .weText{
+
+    .weText {
         font-size: .2rem;
+        text-align: center;
     }
-    .aRImgItem img{
+
+    .aRImgItem img {
         width: 1.5rem;
-        height: 0.75rem;
-    }
-    .aRImgItemLast img{
-        width: 2.0rem;
-        height: 0.75rem;
+        height: .75rem;
     }
-    .fLinkTitle{
+
+    .fLinkTitle {
         font-size: .24rem;
     }
-    .fLinkItem{
+
+    .fLinkItem {
         font-size: .22rem;
     }
 }

+ 9 - 7
public/assets/index/css/index.css

@@ -186,10 +186,12 @@ body{
     position: absolute;
     z-index: 1;
     right: 0;
-    bottom: .1rem;
+    bottom: .12rem;
     padding: .08rem;
     font-size: 0;
     cursor: pointer;
+    display: flex;
+    align-items: center;
 }
 .goodsShareBotton img{
     width: .24rem;
@@ -515,16 +517,16 @@ body{
     font-weight: bold;
     font-size: .36rem; 
     color: #000; 
-    margin-bottom: .12rem;
+    margin-bottom: .24rem;
 }
 .partnersList{
     display: -ms-grid; 
     display: grid;
-    grid-template-columns: repeat(8, 1fr);
-    grid-gap: .08rem .02rem; 
+    grid-template-columns: repeat(6, 2rem);
+    grid-gap: .24rem .24rem; 
 } 
 .partnersItem{ 
-    height: .77rem;
+    height: .8rem;
     font-size: 0;
     display: flex;
     align-items: center;
@@ -532,8 +534,8 @@ body{
 }
 .partnersItem .partnersLogo{
     object-fit: contain;
-    width: 1rem;
     height: 100%;
+    width: 100%;
 }
 /* end 盟友模块 --> */
 
@@ -595,7 +597,7 @@ body{
     font-size: .16rem;
   }
   .partnersList{
-    grid-template-columns: repeat(6, 1fr);
+    grid-template-columns: repeat(5, 1fr);
   }
 .goodsShareBotton img{
     width: .3rem;

+ 4 - 4
public/assets/index/css/shoppingCart.css

@@ -173,7 +173,7 @@ body{
     color: rgba(79, 73, 222, 1);
 }
 
-/* ------------------------ */
+/* new start------------------------ */
 #selectABox{
     display: none;
 }
@@ -330,7 +330,7 @@ body{
     background: transparent;
     color: #434343;
 }
-/* ------------------------ */
+/* new end------------------------ */
 
 
 #changeAddress{
@@ -565,7 +565,7 @@ body{
     }
 
 
-    /* ------------------------ */
+    /* new start------------------------ */
     .windContainer{
         width: auto;
         padding-left: .52rem;
@@ -616,7 +616,7 @@ body{
         font-size: .22rem;
         height: .56rem;
     }
-/* ------------------------ */
+/* new end------------------------ */
 }
 @media (max-width: 750px) {
     .pageDataBox{