Browse Source

'第一次表单页面适配'

chending1994 4 years ago
parent
commit
d4667ee194
1 changed files with 12 additions and 10 deletions
  1. 12 10
      src/pages/contact/show.vue

+ 12 - 10
src/pages/contact/show.vue

@@ -217,7 +217,7 @@ export default {
             this.$mRouter.redirectTo({
               route: this.route
             })
-          }, 3000);
+          }, 2000);
         }).catch(err => {
           this.disabled = false;
           console.log('err')
@@ -254,11 +254,14 @@ export default {
 
 <style lang="scss">
 .contact-show {
-  height: 100vh;
-  padding-top: 56upx;
-  overflow: hidden;
+  min-height: 100vh;
+  // height: 100vh;
+  padding-top: 40upx;
+  // overflow: hidden;
   background: url('@/static/img/contact/bg.png') no-repeat #01A2E8;
   background-size: cover;
+  padding-bottom: constant(safe-area-inset-bottom); /*兼容 IOS<11.2*/
+  padding-bottom: env(safe-area-inset-bottom); /*兼容 IOS>11.2*/
   .head {
     position: relative;
     .path {
@@ -288,7 +291,7 @@ export default {
     }
   }
   .form-warpper {
-    margin-top: 62upx;
+    margin-top: 36upx;
     padding: 0 96upx;
   }
   .input-content-wrapper {
@@ -298,9 +301,9 @@ export default {
     display: flex;
     align-items: center;
     box-sizing: border-box;
-    height: 100upx;
+    height: 96upx;
     border: 2upx solid #003F66;
-    margin-bottom: 34upx;
+    margin-bottom: 26upx;
     padding: 0 42upx 0 42upx;
     background: #FFFFFF;
     border-radius: 172upx;
@@ -326,7 +329,7 @@ export default {
     .input-placeholder {
       color: #B9B9B9;
       line-height: 36px;
-      font-size: 28upx;
+      font-size: 24upx;
       font-family: PingFangSC-Regular, PingFang SC;
       font-weight: 400;
     }
@@ -368,7 +371,6 @@ export default {
   .area-content {
     position: relative;
     border: 2upx solid #003F66;
-    margin-bottom: 36upx;
     padding: 28upx 42upx 20upx 42upx;
     background: #FFFFFF;
     border-radius: 32upx;
@@ -438,7 +440,7 @@ export default {
   }
   .submit-btn {
     position: relative;
-    margin-top: 34upx;
+    margin-top: 26upx;
     text-align: center;
     image {
       width: 334upx;