feat: 样式优化

public/index.html

@@ -6,6 +6,7 @@
     <meta name="viewport" content="width=device-width,initial-scale=1.0" />
     <meta http-equiv="Cache-Control" content="no-store no-cache" />
     <meta name="viewport" content="width=device-width,initial-scale=1.0" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
     <!-- <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests" /> -->
     <link href="<%= BASE_URL %><%= process.env.VUE_APP_ASSETS_DIR %>/config.js" rel="preload" as="script" />
     <!-- <link href="<%= BASE_URL %><%= process.env.VUE_APP_ASSETS_DIR %>/moduleLoader.js" rel="preload" as="script" /> -->

src/assets/styles/reset.less

@@ -166,3 +166,7 @@ body {
   -webkit-text-size-adjust: none;
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }
+
+.van-dialog__message {
+  font-size: 16px !important;
+}

src/components/Common/AddressPopup/AddAddressPopup.vue

@@ -159,7 +159,7 @@ export default {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  padding: 12px;
+  padding: 16px 12px 12px;
   font-size: 14px;
   &-title {
     font-size: 16px;

src/components/Common/AddressPopup/AddressPopup.vue

@@ -196,7 +196,7 @@ export default {
   display: flex;
   align-items: center;
   justify-content: center;
-  padding: 12px;
+  padding: 16px 12px 12px;
   font-size: 14px;
   &-title {
     font-size: 16px;
@@ -232,8 +232,8 @@ export default {
       align-items: center;
       margin-left: 15px;
       img {
-        width: 16px;
-        height: 16px;
+        width: 20px;
+        height: 20px;
         margin-right: 4px;
       }
       .name {
@@ -306,8 +306,8 @@ export default {
         display: flex;
         align-items: center;
         img {
-          width: 16px;
-          height: 16px;
+          width: 20px;
+          height: 20px;
           margin-left: 10px;
         }
       }
@@ -326,7 +326,7 @@ export default {
   line-height: 36px;
   cursor: pointer;
   text-align: center;
-  margin: 15px auto 25px;
+  margin: 15px auto 28px;
   padding-right: 12px;
 }
 </style>

src/components/Common/ConfigPopup.vue

@@ -29,7 +29,7 @@
         </template>
         <template v-if="item.type === 'address' && item.isChecked">
           <template v-if="!addressList.length">
-            <van-field v-model="form.address" label-width="60" label="收货地址" readonly placeholder="请选择省市区" @focus="isError = false" @click="select" >
+            <van-field v-model="form.address" label-width="60" label="收件地址" readonly placeholder="请选择省市区" @focus="isError = false" @click="select" >
               <template #button>
                 <van-icon name="location" />
               </template>
@@ -45,11 +45,17 @@
             />
           </template>
           <template v-else>
-            <div class="address" @click="isShowAddressPopup = true">
+            <div v-if="lotteryInfo.newPremise[0].isChecked + lotteryInfo.newPremise[1].isChecked === 0" class="address" @click="isShowAddressPopup = true">
               <img class="address-icon" src="@/assets/images/lottery/address.png" alt="">
               <div class="address-text">{{ form.address + form.detail }}</div>
               <img class="address-right" src="@/assets/images/lottery/address-right.png" alt="">
             </div>
+            <div v-else class="address" @click="isShowAddressPopup = true">
+              <div class="address-title">收件地址</div>
+              <img class="address-icon__alter" src="@/assets/images/lottery/address.png" alt="">
+              <div class="address-text">{{ form.address + form.detail }}</div>
+              <img class="address-right" src="@/assets/images/lottery/address-right.png" alt="">
+            </div>
           </template>
         </template>
         <template v-if="item.type.includes('custom') && item.isChecked">
@@ -400,12 +406,13 @@ export default {
 <style lang="less" scoped>
 .main {
   min-height: 42vh;
+  padding-bottom: 30px;
 }
 .top {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  padding: 12px;
+  padding: 16px 12px 12px;
   font-size: 14px;
   &-title {
     font-size: 16px;
@@ -441,25 +448,39 @@ export default {
       width: 24px;
       height: 24px;
       margin-right: 12px;
+      &__alter {
+        width: 20px;
+        height: 20px;
+        margin-right: 5px;
+      }
     }
     &-text {
       flex: 1;
       // width: 225px;
       font-family: PingFangSC, PingFang SC;
       font-weight: 400;
-      font-size: 14px;
+      font-size: 15px;
       color: #333333;
       line-height: 24px;
-      text-align: left;
-      padding-right: 35px;
+      text-align: justify;
+      padding-right: 20px;
     }
     &-right {
       width: 5px;
       height: 9px;
     }
+    &-title {
+      height: 24px;
+      line-height: 24px;
+      font-size: 15px;
+      font-family: PingFangSC, PingFang SC;
+      font-weight: 400;
+      color: #666666;
+      margin-right: 8px;
+    }
   }
   .code {
-    font-size: 13px;
+    font-size: 15px;
     font-family: PingFangSC, PingFang SC;
     font-weight: 400;
     color: #357BF0;
@@ -482,7 +503,7 @@ export default {
     font-size: 15px;
     font-family: PingFangSC, PingFang SC;
     font-weight: 400;
-    color: #333333;
+    color: #666666;
     margin-right: 8px;
     span {
       white-space: nowrap;

src/components/Common/ForcePopup.vue

@@ -76,6 +76,7 @@ export default {
     .box {
       width: 70%;
       position: relative;
+      margin-bottom: 10%;
       &-img {
         width: 100%;
         position: relative;
@@ -117,14 +118,14 @@ export default {
         }
         &__btn {
           width: 120px;
-          height: 33px;
+          height: 36px;
           background: linear-gradient( 201deg, #FD8192 0%, #FF4F31 100%);
           border-radius: 37px;
           font-family: PingFangSC, PingFang SC;
           font-weight: 500;
-          font-size: 13px;
+          font-size: 14px;
           color: #FFFFFF;
-          line-height: 33px;
+          line-height: 36px;
           text-align: center;
         }
       }

src/components/Lottery/Timing/Banner.vue

@@ -54,6 +54,7 @@ export default {
     background-size: cover;
     background-position: center;
     font-size: 0;
+    z-index: 3;
   }
 }
 </style>