替换rem

src/pages/login/Help.vue

@@ -38,11 +38,11 @@ export default {
   top: 0;
   overflow: auto;
   color: white;
-  font-size: 1.4rem;
+  font-size: 14rem;
 
   .content {
-    margin-top: 6rem;
-    height: calc(100vh - 6rem);
+    margin-top: 60rem;
+    height: calc(100vh - 60rem);
 
     iframe {
       padding: 0;

src/pages/login/Login.vue

@@ -19,7 +19,7 @@
       <b-button :active="false" type="white" @click="$nav('/login/other')">其他手机号码登录</b-button>
 
       <div class="protocol" :class="showAnim?'anim-bounce':''">
-        <Tooltip style="top: -100%;left: -1rem;" v-model="showTooltip"/>
+        <Tooltip style="top: -100%;left: -10rem;" v-model="showTooltip"/>
         <div class="left">
           <Check v-model="isAgree"/>
         </div>
@@ -118,68 +118,68 @@ export default {
   top: 0;
   overflow: auto;
   color: black;
-  font-size: 1.4rem;
+  font-size: 14rem;
   background: white;
 
   .content {
-    padding: 6rem 3rem;
+    padding: 60rem 30rem;
 
     .desc {
-      margin-bottom: 6rem;
-      margin-top: 12rem;
+      margin-bottom: 60rem;
+      margin-top: 120rem;
       display: flex;
       align-items: center;
       flex-direction: column;
 
       .title {
-        margin-bottom: 2rem;
+        margin-bottom: 20rem;
       }
 
       .phone-number {
-        letter-spacing: .3rem;
-        font-size: 3rem;
-        margin-bottom: 1rem;
+        letter-spacing: 3rem;
+        font-size: 30rem;
+        margin-bottom: 10rem;
       }
 
       .sub-title {
-        font-size: 1.2rem;
+        font-size: 12rem;
         color: @second-text-color;
       }
     }
 
     .button {
       width: 100%;
-      margin-bottom: .5rem;
+      margin-bottom: 5rem;
     }
 
     .protocol {
       position: relative;
       color: gray;
-      margin-top: 2rem;
-      font-size: 1.2rem;
+      margin-top: 20rem;
+      font-size: 12rem;
       display: flex;
 
       .left {
-        padding-top: .1rem;
-        margin-right: .5rem;
+        padding-top: 1rem;
+        margin-right: 5rem;
       }
     }
 
 
     .other-login {
       position: absolute;
-      bottom: 4rem;
-      font-size: 1.2rem;
+      bottom: 40rem;
+      font-size: 12rem;
       display: flex;
       justify-content: center;
-      width: calc(100vw - 6rem);
+      width: calc(100vw - 60rem);
       transform: translateX(-50%);
       left: 50%;
 
       .icons {
         img {
-          width: 4rem;
-          margin-right: 1.5rem;
+          width: 40rem;
+          margin-right: 15rem;
 
           &:nth-last-child(1) {
             margin-right: 0;
@@ -190,8 +190,8 @@ export default {
 
     .other-login-text {
       position: absolute;
-      bottom: 5.5rem;
-      font-size: 1.2rem;
+      bottom: 55rem;
+      font-size: 12rem;
       transform: translateX(-50%);
       left: 50%;
     }

src/pages/login/OtherLogin.vue

@@ -18,7 +18,7 @@
       </div>
 
       <div class="protocol" :class="showAnim?'anim-bounce':''">
-        <Tooltip style="top: -150%;left: -1rem;" v-model="showTooltip"/>
+        <Tooltip style="top: -150%;left: -10rem;" v-model="showTooltip"/>
         <div class="left">
           <Check v-model="isAgree"/>
         </div>
@@ -44,7 +44,7 @@
           page-id="other-login"
           v-model="isOtherLogin"
           :show-heng-gang="false"
-          height="27rem"
+          height="270rem"
           mode="white">
         <div class="block-dialog">
           <div class="item" @click="$no">
@@ -128,22 +128,22 @@ export default {
   top: 0;
   overflow: auto;
   color: black;
-  font-size: 1.4rem;
+  font-size: 14rem;
   background: white;
 
   .block-dialog {
     color: black;
 
     .item {
-      height: 5rem;
+      height: 50rem;
       display: flex;
       justify-content: center;
       align-items: center;
       border-top: 1px solid gainsboro;
 
       img {
-        height: 2.5rem;
-        margin-right: 1rem;
+        height: 25rem;
+        margin-right: 10rem;
       }
 
       &:nth-last-child(1) {
@@ -152,7 +152,7 @@ export default {
     }
 
     .space {
-      height: 1rem;
+      height: 10rem;
       background: whitesmoke;
     }
   }

src/pages/login/PasswordLogin.vue

@@ -14,7 +14,7 @@
       <LoginInput autofocus class="mt1r" type="password" v-model="password" placeholder="请输入密码"/>
 
       <div class="protocol" :class="showAnim?'anim-bounce':''">
-        <Tooltip style="top: -150%;left: -1rem;" v-model="showTooltip"/>
+        <Tooltip style="top: -150%;left: -10rem;" v-model="showTooltip"/>
         <div class="left">
           <Check v-model="isAgree"/>
         </div>
@@ -96,7 +96,7 @@ export default {
   top: 0;
   overflow: auto;
   color: black;
-  font-size: 1.4rem;
+  font-size: 14rem;
   background: white;
 
 }

src/pages/login/RetrievePassword.vue

@@ -27,7 +27,7 @@
 
 
       <div class="protocol" :class="showAnim?'anim-bounce':''">
-        <Tooltip style="top: -150%;left: -1rem;" v-model="showTooltip"/>
+        <Tooltip style="top: -150%;left: -10rem;" v-model="showTooltip"/>
         <div class="left">
           <Check v-model="isAgree"/>
         </div>
@@ -141,7 +141,7 @@ export default {
   top: 0;
   overflow: auto;
   color: black;
-  font-size: 1.4rem;
+  font-size: 14rem;
   background: white;
 
 }

src/pages/login/VerificationCode.vue

@@ -102,15 +102,15 @@ export default {
   top: 0;
   overflow: auto;
   color: black;
-  font-size: 1.4rem;
+  font-size: 14rem;
   background: white;
 
   .options{
-    margin-top: 1rem;
+    margin-top: 10rem;
   }
 
   .button{
-    margin-top: 2rem;
+    margin-top: 20rem;
   }
 
 }

src/pages/login/components/LoginInput.vue

@@ -121,14 +121,14 @@ export default {
 .input-number {
   display: flex;
   background: whitesmoke;
-  padding: 1.5rem 1rem;
-  font-size: 1.4rem;
+  padding: 15rem 10rem;
+  font-size: 14rem;
 
   .left {
     display: flex;
     align-items: center;
-    margin-right: 1rem;
-    padding-right: 1rem;
+    margin-right: 10rem;
+    padding-right: 10rem;
     position: relative;
 
     &.no-border {
@@ -147,25 +147,25 @@ export default {
     img {
       top: 50%;
       transform: translateY(-50%);
-      right: 1rem;
+      right: 10rem;
       position: absolute;
-      height: 1.5rem;
+      height: 15rem;
     }
 
     .arrow {
-      margin-top: .4rem;
-      margin-left: .5rem;
+      margin-top: 4rem;
+      margin-left: 5rem;
       width: 0;
       height: 0;
-      border: .4rem solid transparent;
-      border-top: .5rem solid black;
+      border: 4rem solid transparent;
+      border-top: 5rem solid black;
     }
 
     &::before {
       content: ' ';
       position: absolute;
       width: 1px;
-      height: .8rem;
+      height: 8rem;
       top: 4px;
       right: 0;
       background: gainsboro;
@@ -183,9 +183,9 @@ export default {
     img {
       top: 50%;
       transform: translateY(-50%);
-      right: 1rem;
+      right: 10rem;
       position: absolute;
-      height: 1.5rem;
+      height: 15rem;
     }
 
     .disabled {
@@ -201,7 +201,7 @@ export default {
     caret-color: red;
 
     &[type="password"] {
-      //letter-spacing: 1rem;
+      //letter-spacing: 10rem;
     }
   }
 }

src/pages/login/components/Tooltip.vue

@@ -42,20 +42,20 @@ export default {
 .Tooltip {
   z-index: 2;
   position: absolute;
-  font-size: 1.2rem;
+  font-size: 12rem;
   color: white;
-  padding: 1rem;
-  border-radius: .8rem;
+  padding: 10rem;
+  border-radius: 8rem;
   background: black;
 
   .arrow {
     width: 0;
     height: 0;
-    border: .7rem solid transparent;
-    border-top: .7rem solid black;
+    border: 7rem solid transparent;
+    border-top: 7rem solid black;
     position: absolute;
-    left: 1rem;
-    bottom: -1.4rem;
+    left: 10rem;
+    bottom: -14rem;
   }
 }
 

src/pages/login/countryChoose.vue

@@ -2442,22 +2442,22 @@ export default {
   bottom: 0;
   top: 0;
   color: white;
-  font-size: 1.4rem;
+  font-size: 14rem;
   overflow: hidden;
 
   .indicator-ctn {
-    width: 2.5rem;
+    width: 25rem;
     height: 100vh;
     position: fixed;
     z-index: 3;
     top: 0;
-    right: 0.5rem;
+    right: 5rem;
     display: flex;
     align-items: center;
     justify-content: center;
 
     .indicator {
-      width: 2.5rem;
+      width: 25rem;
       display: flex;
       flex-direction: column;
       align-items: center;
@@ -2466,16 +2466,16 @@ export default {
       div {
         color: @second-text-color;
         //transition: all .3s;
-        font-size: 1rem;
-        padding: .1rem;
+        font-size: 10rem;
+        padding: 1rem;
       }
 
       .arrow {
-        padding: 0 0 .3rem 0;
+        padding: 0 0 3rem 0;
         width: 0;
         height: 0;
-        border: .5rem solid transparent;
-        border-bottom: 1rem solid @second-text-color;
+        border: 5rem solid transparent;
+        border-bottom: 10rem solid @second-text-color;
       }
     }
   }
@@ -2483,30 +2483,30 @@ export default {
 
   .fixed {
     position: fixed;
-    top: 11rem;
-    left: 2rem;
-    right: 2rem;
+    top: 110rem;
+    left: 20rem;
+    right: 20rem;
   }
 
   .content {
-    height: calc(100% - 11rem);
-    margin-top: 11rem;
-    padding: 0 2.5rem 0 2rem;
+    height: calc(100% - 110rem);
+    margin-top: 110rem;
+    padding: 0 25rem 0 20rem;
     box-sizing: border-box;
     width: 100%;
     overflow-y: scroll;
 
     .top {
-      padding-bottom: 1rem;
+      padding-bottom: 10rem;
       border-bottom: 1px solid @line-color;
 
       .cities {
         .city {
-          margin-right: .4rem;
-          margin-bottom: .4rem;
-          border-radius: .2rem;
-          height: 4rem;
-          line-height: 4rem;
+          margin-right: 4rem;
+          margin-bottom: 4rem;
+          border-radius: 2rem;
+          height: 40rem;
+          line-height: 40rem;
           background: @second-btn-color-tran;
           display: inline-block;
           width: 32%;
@@ -2516,7 +2516,7 @@ export default {
     }
 
     .list {
-      //padding-right: 2.5rem;
+      //padding-right: 25rem;
 
       .row {
         background: @main-bg;