pimhwang
/
douyin
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

替换rem

pull/29/head
zyronon 2 years ago
parent
7a3a791b28
commit
9fa31d8824
9 changed files with 82 additions and 82 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 6
      src/pages/login/Help.vue
  2. 44
      src/pages/login/Login.vue
  3. 14
      src/pages/login/OtherLogin.vue
  4. 4
      src/pages/login/PasswordLogin.vue
  5. 4
      src/pages/login/RetrievePassword.vue
  6. 6
      src/pages/login/VerificationCode.vue
  7. 28
      src/pages/login/components/LoginInput.vue
  8. 14
      src/pages/login/components/Tooltip.vue
  9. 44
      src/pages/login/countryChoose.vue

6
src/pages/login/Help.vue
Unescape View File

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

44
src/pages/login/Login.vue
Unescape View File

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

14
src/pages/login/OtherLogin.vue
Unescape View File

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

4
src/pages/login/PasswordLogin.vue
Unescape View File

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

4
src/pages/login/RetrievePassword.vue
Unescape View File

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

6
src/pages/login/VerificationCode.vue
Unescape View File

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

28
src/pages/login/components/LoginInput.vue
Unescape View File

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

14
src/pages/login/components/Tooltip.vue
Unescape View File

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

44
src/pages/login/countryChoose.vue
Unescape View File

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

Write Preview
Loading…
Cancel
Save