css 修改

src/App.vue

@@ -8,33 +8,33 @@
                 <router-link to="/home">
                     <div class="cell">
                         <div>
-                            <van-icon :color="navNum==1?'#38D0C9':'#BBBBBB'" class="iconfont" size="30" class-prefix="icon" slot="left-icon" name="lvyou"></van-icon>
+                            <van-icon :color="navNum==1?'#38d0c9':'#818181'" class="iconfont" size="26" class-prefix="icon" slot="left-icon" name="lvyou"></van-icon>
                         </div>
-                        <div><span :style="{color:navNum==1?'#38D0C9':'#BBBBBB'}">{{ $t("navbar.home") }}</span></div>
+                        <div><span :style="{color:navNum==1?'#38d0c9':'#818181'}">{{ $t("navbar.home") }}</span></div>
                     </div>
                 </router-link>
                 <router-link to="/news">
                     <div class="cell">
                         <div>
-                            <van-icon :color="navNum==2?'#38D0C9':'#BBBBBB'" name="chat-o" />
+                            <van-icon :color="navNum==2?'#38d0c9':'#818181'" name="chat-o" />
                         </div>
-                        <div><span :style="{color:navNum==2?'#38D0C9':'#BBBBBB'}">{{ $t("navbar.news") }}</span></div>
+                        <div><span :style="{color:navNum==2?'#38d0c9':'#818181'}">{{ $t("navbar.news") }}</span></div>
                     </div>
                 </router-link>
                 <router-link to="/shopping">
                     <div class="cell">
                         <div>
-                            <van-icon :color="navNum==3?'#38D0C9':'#BBBBBB'" name="shopping-cart-o" />
+                            <van-icon :color="navNum==3?'#38d0c9':'#818181'" name="shopping-cart-o" />
                         </div>
-                        <div><span :style="{color:navNum==3?'#38D0C9':'#BBBBBB'}">{{ $t("navbar.shopping") }}</span></div>
+                        <div><span :style="{color:navNum==3?'#38d0c9':'#818181'}">{{ $t("navbar.shopping") }}</span></div>
                     </div>
                 </router-link>
                 <router-link to="/personal">
                     <div class="cell">
                         <div>
-                            <van-icon :color="navNum==4?'#38D0C9':'#BBBBBB'" name="user-o" />
+                            <van-icon :color="navNum==4?'#38d0c9':'#818181'" name="user-o" />
                         </div>
-                        <div><span :style="{color:navNum==4?'#38D0C9':'#BBBBBB'}">{{ $t("navbar.personal") }}</span></div>
+                        <div><span :style="{color:navNum==4?'#38d0c9':'#818181'}">{{ $t("navbar.personal") }}</span></div>
                     </div>
                 </router-link>
             </div>
@@ -176,15 +176,17 @@ document.documentElement.style.fontSize = fontSize + "px";
     color: #2c3e50;
     .nav {
         width: 100%;
-        height: 0.84rem /* 84/100 */;
+        height: 0.78rem /* 84/100 */;
+
         .navBox {
             position: fixed;
             left: 0;
             bottom: 0;
             width: 100%;
             height: 0.84rem /* 84/100 */;
+            height:0.78rem;
             display: flex;
-            padding: 0.14rem /* 14/100 */ 0.34rem /* 34/100 */ 0.24rem
+            padding: 0.10rem /* 14/100 */ 0.34rem /* 34/100 */ 0.20rem
                 /* 24/100 */ 0.34rem /* 34/100 */;
             box-sizing: border-box;
             justify-content: space-between;
@@ -194,11 +196,14 @@ document.documentElement.style.fontSize = fontSize + "px";
             z-index: 2;
             .cell {
                 width: 0.6rem /* 30/100 */;
+                line-height:1.1;
                 > div:nth-child(1) {
                     font-size: 0.3rem /* 12/100 */;
+                    margin-top:-30px;
                 }
                 > div:nth-child(2) {
-                    font-size: 0.12rem /* 12/100 */;
+                    font-size: 0.1rem /* 12/100 */;
+                    font-weight:500;
                 }
             }
         }

src/components/pages/nav.vue

@@ -4,8 +4,10 @@
             <div class="navIcon" v-if="iconType">
                 <van-icon name="arrow-left" @click="goBack" />
             </div>
+
             <div class="navTitle">
                 {{title}}
+
             </div>
             <!--
             <div class="navOut" v-if="out">
@@ -131,6 +133,7 @@ export default {
         left: 0;
         z-index: 99;
         background: #fff;
+        border-bottom:#F9F9F9 1px solid;
         .navIcon {
             font-size: 0.16rem /* 16/100 */;
             position: absolute;
@@ -138,15 +141,18 @@ export default {
             left: 0;
             line-height: 0.44rem /* 44/100 */;
             padding: 0 0.1rem /* 10/100 */;
+
             .van-icon {
                 font-weight: bold;
             }
         }
         .navTitle {
             font-size: 0.17rem /* 16/100 */;
+            font-weight:500;
             text-align: center;
             width: 100%;
             line-height: 0.44rem /* 44/100 */;
+
         }
         .navOut {
             position: absolute;
@@ -154,7 +160,7 @@ export default {
             right: 0;
             line-height: 0.44rem /* 44/100 */;
             padding: 0 0.1rem /* 10/100 */;
-            font-size: 0.14rem /* 14/100 */;
+            font-size: 0.12rem /* 14/100 */;
             display: flex;
             align-items: center;
             > span {
@@ -163,4 +169,6 @@ export default {
         }
     }
 }
+
+
 </style>

src/views/home/home.vue

@@ -1,8 +1,8 @@
 <template>
     <div id="home">
-        <Nav :title="$t('home.title')" :iconType="false"></Nav>
+        <Nav :title="$t('home.title')" :iconType="false"><img src="../../../public/static/images/logo.png" width="30%" class="logotop"></Nav>
         <div class="search">
-            <van-search v-model="searchValue" @search="onSearch" shape="round" background="#F9F9F9" :placeholder="$t('home.searchPlaceholder')" />
+            <van-search v-model="searchValue" @search="onSearch" shape="round" :placeholder="$t('home.searchPlaceholder')" />
         </div>
         <div class="excellent">
             <div class="title">
@@ -47,7 +47,7 @@
         <div class="rank">
             <div class="title">
                 <div class="left">
-                    <van-icon color="#38D0C9" class="iconfont" class-prefix="icon" name="fill" />
+                    <van-icon class="iconfont" class-prefix="icon" name="fill" />
                     {{$t('home.recommend')}}
                 </div>
                 <div class="right"></div>
@@ -306,11 +306,14 @@ export default {
 
 <style lang="scss" scoped>
 #home {
-    background: #f9f9f9;
+    background: #f6f6f6;
     .excellent {
         width: 100%;
         padding: 0.12rem /* 12/100 */;
         box-sizing: border-box;
+        background-color:#fff;
+        padding-bottom:.06667rem;
+        margin-bottom:.10667rem;
         .title {
             display: flex;
             justify-content: space-between;
@@ -321,14 +324,24 @@ export default {
             .left {
                 font-size: 0.16rem /* 16/100 */;
                 color: #333333;
+                font-weight:600;
+                border-left: 0.04rem solid #38d0c9;
+                padding-left: 0.09333rem;
             }
             .right {
                 font-size: 0.13rem /* 13/100 */;
                 color: #999999;
+
                 span:nth-child(1) {
                     margin-right: 0.02rem /* 5/100 */;
                     margin-top: 0.1rem;
+                    color: #878787;
                 }
+
+            }
+            .right .van-icon{
+                 font-size: 14px ;
+                 color: #878787;
             }
         }
         .content {
@@ -364,6 +377,9 @@ export default {
         width: 100%;
         padding: 0.12rem /* 12/100 */;
         box-sizing: border-box;
+        background-color:#fff;
+        padding-bottom:.06667rem;
+        margin-bottom:.10667rem;
         .title {
             display: flex;
             justify-content: space-between;
@@ -371,9 +387,14 @@ export default {
             padding: 0.05rem /* 10/100 */ 0;
             margin-bottom: 0.1rem /* 12/100 */;
             width: 100%;
+
             .left {
                 font-size: 0.16rem /* 16/100 */;
                 color: #333333;
+                font-weight:600;
+                border-left:0.04rem solid #38d0c9;
+                padding-left:.09333rem;
+
             }
             .right {
                 font-size: 0.13rem /* 13/100 */;
@@ -390,33 +411,42 @@ export default {
                 justify-content: space-between;
                 flex-wrap: wrap;
                 padding: 0.05rem /* 15/100 */;
-                font-size: 0.15rem /* 15/100 */;
+                font-size: 0.14rem /* 15/100 */;
                 .cell {
                     width: 48%;
                     height: 1.2rem /* 120/100 */;
                     display: flex;
                     align-items: flex-end;
+
+
+                    border-radius: 0.05rem;
+                    aspect-ratio: 6/8 !important;
+                    box-shadow: 0px 0px 5px #e9e9e9;
                     > div {
                         width: 100%;
-                        height: 44px;
+                        height: 36px;
                         display: flex;
                         justify-content: space-between;
                         align-items: center;
                         padding: 0.1rem /* 10/100 */;
                         box-sizing: border-box;
+                        background-color:#fff;
+                        opacity:.8;
                         > span:nth-child(1) {
-                            color: #fff;
+                            color: #333;
                         }
                         > span:nth-child(2) {
-                            color: #38d0c9;
                             display: block;
-                            height: 0.2rem /* 20/100 */;
+                           /* height: 0.2rem  20/100 ;*/
                             width: 0.2rem /* 20/100 */;
                             border-radius: 50%;
                             background: #fff;
                             line-height: 20px;
                             text-align: center;
                         }
+                        > span:nth-child(2) .van-icon{
+                             font-size:18px;
+                        }
                     }
                 }
                 .cell {
@@ -432,6 +462,9 @@ export default {
         width: 100%;
         padding: 0 0.12rem 0.12rem 0.12rem /* 12/100 */;
         box-sizing: border-box;
+        background-color:#fff;
+        padding:.06667rem 0;
+        margin-bottom:.10667rem;
         .title {
             display: flex;
             justify-content: space-between;
@@ -442,7 +475,13 @@ export default {
             .left {
                 font-size: 0.16rem /* 16/100 */;
                 color: #333333;
+                font-weight:600;
+                .iconfont {
+                font-size:26px;
+                color:#38d0c9;
+                 }
             }
+
             .right {
                 font-size: 0.13rem /* 13/100 */;
                 color: #999999;
@@ -477,19 +516,27 @@ export default {
                             object-fit: cover;
                         }
                         .tagBox {
-                            width: 32px;
-                            height: 32px;
-                            background: url("../../../public/static/images/tagBg.png");
+                            width: .3533rem;
+                            height: .2133rem;
+                            line-height: .2133rem;
+                            /*background: url("../../../public/static/images/tagBg.png");*/
                             position: absolute;
                             left: 0;
                             top: 0;
                             z-index: 1;
-                            font-size: 0.14rem /* 16/100 */;
+                            font-size: 0.16rem /* 16/100 */;
                             text-align: left;
+                            font-weight:600;
+                            background-color:#38d0c9;
+                            border-color:#38d0c9;
+                            border-bottom-right-radius:.14667rem;
+
+
                             span {
-                                margin-top: 0.05rem /* 5/100 */;
-                                margin-left: 0.05rem /* 5/100 */;
+                                margin-top: 0rem /* 5/100 */;
+                                margin-left: .08rem /* 5/100 */;
                                 display: inline-block;
+                                font-family:PingFangSC-Regular;
                                 color: #fff;
                             }
                         }
@@ -497,7 +544,7 @@ export default {
                     .right {
                         padding-top: 0.03rem /* 3/100 */;
                         width: 72%;
-                        font-size: 0.15rem /* 15/100 */;
+                        font-size: 0.14rem /* 15/100 */;
                         display: flex;
                         flex-direction: column;
                         justify-content: space-between;
@@ -511,7 +558,7 @@ export default {
                             box-sizing: border-box;
                             > div:nth-child(1) {
                                 text-align: justify;
-                                color: #38d0c9;
+                                /*color: #38d0c9;*/
                                 width: 55%;
                                 overflow: hidden;
                                 display: -webkit-box; /*盒子模型微弹性伸缩模型*/
@@ -539,6 +586,7 @@ export default {
                             display: -webkit-box; /*盒子模型微弹性伸缩模型*/
                             -webkit-box-orient: vertical; /*伸缩盒子的子元素垂直排列*/
                             -webkit-line-clamp: 2; /*文本显示3行*/
+                            font-size: 0.12rem /* 15/100 */;
                         }
                     }
                 }
@@ -549,12 +597,23 @@ export default {
 </style>
 <style>
 #home .van-search__content {
-    border: 1px solid #6acdc8;
+    /*border: 1px solid #6acdc8;*/
+    background-color:#f6f6f6;
+
 }
 #home .van-field__left-icon {
-    color: #6acdc8;
+    color: #ccc;
 }
 #home .van-image {
     height: 100%;
 }
+.logotop{
+position:absolute;
+top: 5px;
+left:35%;
+justify-content:center;
+z-index:99999;
+
+background-color:#fff;
+}
 </style>

src/views/home/pages/confirmOrder/confirmOrder.vue

@@ -103,7 +103,7 @@
                     <div class="bottom">
                         <div class="bottomCell">
                             <div>
-                                <img src="@/../public/static/images/zfb.png" alt="" srcset="">
+                                <img src="@/../public/static/images/line-app-icon.png" alt="" srcset="">
                                 <span>{{$t('confirmOrder.zfb')}}</span>
                             </div>
                             <div class="def1">
@@ -124,7 +124,7 @@
                     </div>
                     <div>
                         <div>
-                            <van-button  :disabled="submitType" @click="placeOrder" size="small" color="#38D0C9" block>{{$t('confirmOrder.submit')}}</van-button>
+                            <van-button  :disabled="submitType" @click="placeOrder" size="small" block>{{$t('confirmOrder.submit')}}</van-button>
                         </div>
                     </div>
                 </div>
@@ -352,7 +352,7 @@ export default {
 <style lang="scss" scoped>
 #confirmOrder {
     .content {
-        background: #f9f9f9;
+        background: #f6f6f6;
         min-height: calc(100vh - 1.28rem /* 128/100 */);
         padding-top: 0.12rem /* 12/100 */;
         box-sizing: border-box;
@@ -441,6 +441,7 @@ export default {
                         }
                         > img {
                             margin-right: 0.05rem /* 10/100 */;
+                            width:30px;
                         }
                     }
                     > div:nth-child(2) {
@@ -501,6 +502,13 @@ export default {
                 > div {
                     width: 1rem /* 100/100 */;
                 }
+                button{
+                border-radius:30px;
+                background-color:#38d0c9;
+                color:#fff;
+                font-weight:600;
+
+                }
             }
         }
     }

src/views/home/pages/productDetails/productDetails.vue

@@ -39,7 +39,7 @@
                 </div>
                 <div class="right">
                     <van-skeleton :row="1" :loading="loading">
-                        <span>￥{{commodityDetails.commodity.commodityCouponList[0].discountPrice}}</span>
+                        <span><span class="yen">￥</span>{{commodityDetails.commodity.commodityCouponList[0].discountPrice}}</span>
                     </van-skeleton>
                     <span @click="receive" v-if="commodityDetails.commodity.couponUser=='0'">{{$t('productDetails.receive')}}</span>
                     <span v-else>{{$t('productDetails.received')}}</span>
@@ -159,15 +159,15 @@
             <div class="cell">
                 <div class="left">
                     <template v-if="commodityDetails.commodity.collectionUser=='1'">
-                        <van-icon @click="collection(1)" name="star" size="24" color="#38D0C9" />
+                        <van-icon @click="collection(1)" name="star" size="24" color="#38d0c9" />
                     </template>
                     <template v-else>
-                        <van-icon @click="collection(0)" name="star-o" size="24" color="#38D0C9" />
+                        <van-icon @click="collection(0)" name="star-o" size="24" color="#38d0c9" />
                     </template>
                 </div>
                 <div class="right">
-                    <van-button @click="purchase('join')" color="#38D0C9" plain>{{$t('productDetails.addToCart')}}</van-button>
-                    <van-button @click="purchase('immediately')" color="#38D0C9">{{$t('productDetails.buyNow')}}</van-button>
+                    <van-button @click="purchase('join')" color="#38d0c9" plain>{{$t('productDetails.addToCart')}}</van-button>
+                    <van-button @click="purchase('immediately')" color="#38d0c9">{{$t('productDetails.buyNow')}}</van-button>
                 </div>
             </div>
         </div>
@@ -195,7 +195,7 @@
                 <div class="setOutBox">
                     <van-radio-group v-model="choice.setOut" direction="horizontal">
                         <div class="setOutCell" v-for="item,index in setOutList" :key="index">
-                            <van-radio checked-color="#29c8bd" :name="item">{{item}}{{$t('productDetails.setOut')}}</van-radio>
+                            <van-radio checked-color="#38d0c9" :name="item">{{item}}{{$t('productDetails.setOut')}}</van-radio>
                         </div>
                     </van-radio-group>
                 </div>
@@ -219,7 +219,7 @@
                         <span>{{$t('productDetails.surplus')}}:</span><span>{{stockNum}}</span>
                     </div>
                     <div class="but">
-                        <van-button @click="confirm" type="primary" color="#38D0C9" block>{{$t('productDetails.confirm')}}</van-button>
+                        <van-button @click="confirm" type="primary" color="#38d0c9" block>{{$t('productDetails.confirm')}}</van-button>
                     </div>
                 </div>
             </div>
@@ -764,6 +764,8 @@ export default {
         .titleBox {
             display: flex;
             align-items: center;
+            background-image: linear-gradient(#38d0c9,#adebc3);
+            border-radius:0.1rem 0.1rem 0 0;
             .title {
                 font-size: 0.16rem /* 16/100 */;
                 font-weight: bold;
@@ -771,7 +773,7 @@ export default {
                 padding: 0.2rem /* 20/100 */ 0.09rem /* 9/100 */;
                 box-sizing: border-box;
                 text-align: left;
-                color: #333333;
+                color: #fff;
             }
             .stock {
                 width: 30%;
@@ -779,12 +781,12 @@ export default {
                 justify-content: center;
                 flex-direction: column;
                 span:nth-child(1) {
-                    color: #38d0c9;
+                    color: #fff;
                     font-size: 0.2rem /* 20/100 */;
                 }
                 span:nth-child(2) {
                     font-size: 14px;
-                    color: #999999;
+                    color: #fff;
                 }
             }
         }
@@ -793,14 +795,12 @@ export default {
         // height: .82rem /* 82/100 */;
         // border: 1px solid #000;
         margin-top: 0.05rem /* 5/100 */;
-        border-radius: 0.1rem /* 10/100 */ 0.1rem /* 10/100 */ 0 0;
-        background-image: repeating-linear-gradient(
-            45deg,
-            #4be2db 9%,
-            #29c8bd 12%
-        );
+        /*border-radius: 0.1rem 0.1rem .5rem .5rem;
+        background-image: linear-gradient(#e5585f,#fff);*/
         display: flex;
         padding: 0.12rem /* 15/100 */;
+        border-bottom:1px #d85158 solid;
+        background-color: #fcf2f1;
         .left {
             display: flex;
             flex-direction: column;
@@ -808,10 +808,11 @@ export default {
             align-items: flex-start;
             width: 70%;
             box-sizing: border-box;
-            color: #fff;
+            color: #3e3a39;
             span:nth-child(1) {
                 font-size: 0.14rem /* 16/100 */;
                 margin: 0.02rem /* 5/100 */ 0;
+                font-weight:600;
             }
             span:nth-child(2),
             span:nth-child(3) {
@@ -827,12 +828,18 @@ export default {
             width: 30%;
             box-sizing: border-box;
             border-left: 1px dashed #fff;
-            color: #fff;
+            color: #e56051;
+            font-weight:600;
             span:nth-child(1) {
-                font-size: 0.3rem /* 30/100 */;
+                font-size: 0.5rem /* 30/100 */;
+                vertical-align: 1px;
+            }
+            span:nth-child(1) .yen {
+
+                font-size:0.14rem;
             }
             span:nth-child(2) {
-                font-size: 0.16rem /* 16/100 */;
+                font-size: 0.12rem /* 16/100 */;
             }
         }
     }
@@ -848,7 +855,7 @@ export default {
             padding: 0.15rem /* 15/100 */;
             box-sizing: border-box;
             > span {
-                border-left: 2px solid #29c8bd;
+                border-left: 2px solid #38d0c9;
                 padding: 0 0.05rem /* 5/100 */;
             }
         }
@@ -1076,7 +1083,7 @@ export default {
         }
         .timeBox {
             display: flex;
-            font-size: 0.15rem /* 15/100 */;
+            font-size: 0.12rem /* 15/100 */;
             padding: 12px 0;
             > div:nth-child(1) {
                 width: 80%;
@@ -1084,7 +1091,7 @@ export default {
                 justify-content: space-between;
                 > div {
                     width: 23%;
-                    height: 0.6rem /* 50/100 */;
+                    /*height: 0.6rem  50/100 */;
                     display: flex;
                     align-items: center;
                     justify-content: space-between;
@@ -1093,14 +1100,15 @@ export default {
                     box-sizing: border-box;
                     color: #333;
                     border-radius: 0.05rem /* 5/100 */;
-                    border: 1px solid #4be2db;
+                    border: 1px solid #38d0c9;
                 }
                 > div.active {
-                    background-image: repeating-linear-gradient(
+                    /*background-image: repeating-linear-gradient(
                         45deg,
-                        #4be2db 9%,
-                        #29c8bd 12%
-                    );
+                        #38d0c9 9%,
+                        #fae1bf 12%
+                    );*/
+                    background-color:#38d0c9;
                     color: #fff;
                 }
             }
@@ -1172,4 +1180,8 @@ export default {
 #productDetails .bottomBox .cell .right .van-button{
     margin-left: .1rem /* 10/100 */;
 }
+#productDetails .bottomBox .cell .right .van-button:nth-child(2) {
+
+    background-image: linear-gradient(to right, #67be64, #fae1bf);
+}
 </style>

src/views/news/news.vue

@@ -140,7 +140,7 @@ export default {
             margin-bottom: 0.12rem /* 12/100 */;
             .top {
                 font-size: 0.15rem /* 15/100 */;
-                font-weight: bold;
+                font-weight: 600;
             }
             .center {
                 font-size: 0.14rem /* 14/100 */;
@@ -156,8 +156,8 @@ export default {
             }
             .bottom {
                 border-top: 1px solid #eeeeee;
-                font-size: 0.13rem /* 13/100 */;
-                padding: 0.12rem /* 12/100 */ 0;
+                font-size: 0.10rem /* 13/100 */;
+                padding: 0.06rem 0 0.12rem 0;
                 display: flex;
                 justify-content: space-between;
                 align-items: center;

src/views/news/pages/details/details.vue

@@ -73,7 +73,7 @@ export default {
                 font-size: 0.17rem /* 17/100 */;
             }
             .information {
-                font-size: 0.14rem /* 14/100 */;
+                font-size: 0.12rem /* 14/100 */;
                 text-align: left;
                 padding: 0.15rem /* 15/100 */ 0;
             }

src/views/personal/pages/toBePaid/toBePaid.vue

@@ -359,6 +359,9 @@ export default {
                     justify-content: flex-end;
                     > div {
                         width: 30%;
+                        button{
+                        border-radius:30px;
+                        }
                     }
                     > div:nth-child(2) {
                         margin-left: 10px;

src/views/personal/personal.vue

@@ -8,7 +8,7 @@
                         <span>{{userData.name}}</span>
                     </div>
                     <div @click="getPerfect">
-                        <van-icon name="edit" color="#38D0C9" size="14" />
+                        <van-icon name="edit" color="#38d0c9" size="14" />
                         <span>{{$t('personal.perfect')}}</span>
                     </div>
                 </div>
@@ -231,12 +231,14 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+
 #personal {
+
     .content {
-        background: #f9f9f9;
+        background: #f6f6f6;
         .top {
             padding: 0.12rem /* 12/100 */;
-            background: #fff;
+
             .perfect {
                 display: flex;
                 align-items: center;
@@ -244,10 +246,16 @@ export default {
                 padding: 0.1rem /* 10/100 */ 0;
                 > div:nth-child(1) {
                     font-size: 0.17rem /* 17/100 */;
+                    text-align:left;
+                    font-weight:600;
                 }
                 > div:nth-child(2) {
-                    font-size: 0.14rem /* 14/100 */;
-                    color: #38d0c9;
+                    font-size: 0.12rem /* 14/100 */;
+                    color: #818181;
+                    padding-left:30px;
+                    border: 1px #818181 solid;
+                    border-radius: 30px;
+                    padding: 0 20px;
                     > span {
                         margin-left: 0.03rem /* 3/100 */;
                     }
@@ -259,10 +267,11 @@ export default {
                 padding: 0.1rem /* 10/100 */ 0;
             }
             .cell {
-                background-image: linear-gradient(#4be2db, #29c8bd);
+                background-image: linear-gradient(#38d0c9, #adebc3);
+
                 padding: 0.12rem /* 12/100 */;
                 box-sizing: border-box;
-                border-radius: 8px 8px 0 0;
+                border-radius: 15px 15px 0 0;
                 .title {
                     font-size: 0.14rem /* 14/100 */;
                     color: #fff;
@@ -271,11 +280,12 @@ export default {
                 }
                 .list {
                     padding: 0.12rem /* 12/100 */ 0;
-                    font-size: 0.14rem /* 14/100 */;
+                    font-size: 0.12rem /* 14/100 */;
                     box-sizing: border-box;
                     display: flex;
                     align-items: center;
                     flex-wrap: wrap;
+                    justify-content: space-between;
                     > div {
                         width: 25%;
                         height: 0.5rem /* 42/100 */;
@@ -301,18 +311,20 @@ export default {
             .cell {
                 padding: 0.12rem /* 12/100 */;
                 box-sizing: border-box;
-                border-radius: 8px 8px 0 0;
-                background: #fff;
+                border-radius: 15px 15px 0 0;
+                background-color:#fff;
                 margin-bottom: 0.12rem /* 12/100 */;
+
                 .title {
                     font-size: 0.14rem /* 14/100 */;
                     color: #333;
                     text-align: left;
+                    font-weight:600;
                     // padding: .08rem /* 8/100 */ 0;
                 }
                 .list {
                     padding: 0.12rem /* 12/100 */ 0;
-                    font-size: 0.14rem /* 14/100 */;
+                    font-size: 0.12rem /* 14/100 */;
                     box-sizing: border-box;
                     display: flex;
                     align-items: center;
@@ -336,6 +348,12 @@ export default {
                     }
                 }
             }
+            > div:nth-child(1) {
+                background-image: linear-gradient(#adebc3, #fff);
+                }
+            > div:nth-child(2) {
+                background-image: linear-gradient(#eef3f2, #fff);
+                }
         }
     }
 }

src/views/shopping/shopping.vue

@@ -18,7 +18,7 @@
                             <div class="discount">
                                 <div class="discountBox"><span v-if="item.isCoupon==1">{{$t('shopping.receive1')}}{{item.couponMoney}}{{$t('shopping.receive2')}}</span></div>
                                 <div class="delBox">
-                                    <van-icon @click="deletes(item)" name="delete-o" color="#999999" size="14" />
+                                    <van-icon @click="deletes(item)" name="delete-o" color="#999999" size="24" />
                                 </div>
                             </div>
                         </div>
@@ -84,7 +84,7 @@
                 <div class="purchaseBox">
                     <div class="cell">
                         <div>
-                            <van-checkbox checked-color="#38D0C9" v-model="checkedAll" @click="checkedAllChange"><span style="color:#fff">{{$t('shopping.selectAll')}}</span></van-checkbox>
+                            <van-checkbox checked-color="#f39c11" v-model="checkedAll" @click="checkedAllChange"><span style="color:#fff">{{$t('shopping.selectAll')}}</span></van-checkbox>
                         </div>
                         <div>
                             <div>
@@ -356,6 +356,7 @@ export default {
                         }
                         > span:nth-child(2) {
                             color: #e94225;
+                            font-size: 0.12rem;
                         }
                     }
                     .def1 {
@@ -391,6 +392,7 @@ export default {
                 bottom: 0.84rem /* 84/100 */;
                 left: 0;
                 background: #38d0c9;
+                /*background-image: linear-gradient(to right,#f7ce67, #e7a03c);*/
                 // box-shadow: 0px 0px 5px #e9e9e9;
                 z-index: 1;
                 display: flex;
@@ -404,9 +406,14 @@ export default {
                 }
                 > div:nth-child(2) {
                     font-size: 0.14rem /* 13/100 */;
+                    font-weight:600;
                     > div {
                         width: 1rem /* 100/100 */;
                     }
+                    button{
+                    border-radius:30px;
+
+                    }
                 }
                 .butSpan {
                     color: #38d0c9;