首页待开课

src/components/activity/extensionV1Shop.vue

 <template>
   <div class="activity">
     <img v-lazy="img1" alt />
-    <div class="title">注册领取课程</div>
+    <div class="box">
       <div class="form-block">
+        <div class="title">注册领取课程</div>
         <div class="input-block">
           <input
             placeholder="手机（用于接收课程信息）"
@@ -32,6 +33,7 @@
           <img :src="lock" alt />&nbsp;唱唱会保护您的隐私 请放心输入
         </div>
       </div>
+    </div>
     <img v-lazy="img2" alt />
     <img v-lazy="img3" alt />
     <img v-lazy="img4" alt />
@@ -127,7 +129,8 @@ export default {
         query.cct_user_id = comment.getParamhref().cct_user_id;
       }
       console.log(json);
-      bindMobileApi(json).then(data => {
+      bindMobileApi(json)
+        .then(data => {
           getUserDetailApi().then(res => {
             localStorage.setItem("userDesc", JSON.stringify(res));
             this.$router.push({
@@ -135,7 +138,8 @@ export default {
               query: query
             });
           });
-        }).catch(res => {});
+        })
+        .catch(res => {});
     },
     refImgCode() {
       this.$refs.imgCode.src = "/api/public/img/verify?flag=" + Math.random();
@@ -189,13 +193,13 @@ video {
 @borderRadius: 8px;
 .activity {
   background-color: #f9d048;
-  padding-bottom: 63* @toVw;
-  .title{
+  padding-bottom: 63 * @toVw;
+  .title {
     font-size: 16 * @toVw;
     font-weight: bold;
     color: #952700;
     text-align: center;
-    margin-top: 13 * @toVw;
+    margin: 4 * @toVw 0  13 * @toVw;
   }
   .codeMsg {
     border-radius: 4 * @toVw;
@@ -209,22 +213,27 @@ video {
       opacity: 0.5;
     }
   }
+  .box{
+    padding: 0 12 * @toVw 10 * @toVw;
+    margin-top: 10 * @toVw;
+  }
   .form-block {
     // position: relative;
     z-index: 10;
     background: #f9d048;
     // top: -42*@toVw;
-    padding: 20 * @toVw;
-    // border-radius:20*@toVw;
+    background: white;
+    border-radius:5*@toVw;
+    padding: 10*@toVw;
     .tip {
       font-size: 12 * @toVw;
       color: #952700;
       text-align: center;
       margin-top: 16px;
-      img{
-        width: 11* @toVw;
+      img {
+        width: 11 * @toVw;
         position: relative;
-        top: 2* @toVw;
+        top: 2 * @toVw;
       }
     }
     .input-block {