替换rem
This commit is contained in:
zyronon
parent
e83e27b2e9
commit
ec18f5b540
@ -1734,9 +1734,9 @@ export default {
|
||||
overflow: auto;
|
||||
|
||||
.content {
|
||||
padding: 6rem 1rem 10rem 2rem;
|
||||
padding: 60rem 10rem 100rem 20rem;
|
||||
color: white;
|
||||
font-size: 1.4rem;
|
||||
font-size: 14rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -56,11 +56,11 @@ export default {
|
||||
color: white;
|
||||
|
||||
.content {
|
||||
padding-top: 6rem;
|
||||
padding-top: 60rem;
|
||||
|
||||
.recommend {
|
||||
.title {
|
||||
padding: 20px 20px 10px 20px;
|
||||
padding: 20rem 20rem 10rem 20rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
@ -69,25 +69,25 @@ export default {
|
||||
color: @second-text-color;
|
||||
|
||||
img {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
width: 10rem;
|
||||
height: 10rem;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
border-radius: 50%;
|
||||
background: @second-text-color;
|
||||
padding: 5px;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
padding: 5rem;
|
||||
width: 10rem;
|
||||
height: 10rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
text-align: center;
|
||||
line-height: 6rem;
|
||||
height: 6rem;
|
||||
line-height: 60rem;
|
||||
height: 60rem;
|
||||
color: @second-text-color;
|
||||
|
||||
}
|
||||
|
||||
@ -37,7 +37,7 @@ export default {
|
||||
color: white;
|
||||
|
||||
.content {
|
||||
padding-top: 6rem;
|
||||
padding-top: 60rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -17,7 +17,7 @@
|
||||
placeholder="搜索用户名字/抖音号"
|
||||
:is-show-right-text="false"
|
||||
@click="isShowRightText = true">
|
||||
<img src="../../assets/img/icon/scan-gray.png" style="width: 1rem;transform: scale(1.5)"
|
||||
<img src="../../assets/img/icon/scan-gray.png" style="width: 10rem;transform: scale(1.5)"
|
||||
@click.stop="$nav('/scan')">
|
||||
</Search>
|
||||
<Search v-else v-model="searchKey" :is-show-right-text="true" @notice="search" @clear="isSearch = false"></Search>
|
||||
@ -36,13 +36,13 @@
|
||||
<div class="line"></div>
|
||||
<div class="title">
|
||||
朋友推荐
|
||||
<img src="../../assets/img/icon/about-gray.png" style="width: 1rem;margin-left: .2rem;">
|
||||
<img src="../../assets/img/icon/about-gray.png" style="width: 10rem;margin-left: 2rem;">
|
||||
</div>
|
||||
<People v-for="item in friends.all " :people="item" mode="recommend"></People>
|
||||
</div>
|
||||
<div class="is-search" v-else>
|
||||
<div class="tooltip" v-if="searchKey && !isSearch">
|
||||
<img src="../../assets/img/icon/close.svg" style="width: 1rem;">
|
||||
<img src="../../assets/img/icon/close.svg" style="width: 10rem;">
|
||||
搜索用户名字/抖音号：<span class="searchKey">{{ searchKey }}</span>
|
||||
</div>
|
||||
<!-- TODO -->
|
||||
@ -84,7 +84,7 @@
|
||||
page-id="FindAcquaintance"
|
||||
v-model="moreOptionDialog"
|
||||
:show-heng-gang="false"
|
||||
height="21rem"
|
||||
height="210rem"
|
||||
mode="white">
|
||||
<div class="more-option-dialog">
|
||||
<div class="row" @click="outWebImgAccountDialog = true;moreOptionDialog = false">
|
||||
@ -224,31 +224,31 @@ export default {
|
||||
bottom: 0;
|
||||
top: 0;
|
||||
color: white;
|
||||
font-size: 1.4rem;
|
||||
font-size: 14rem;
|
||||
|
||||
.header {
|
||||
height: 6rem;
|
||||
font-size: 1.4rem;
|
||||
padding: 0 2rem;
|
||||
height: 60rem;
|
||||
font-size: 14rem;
|
||||
padding: 0 20rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid @line-color;
|
||||
|
||||
img {
|
||||
height: 2rem;
|
||||
height: 20rem;
|
||||
}
|
||||
}
|
||||
|
||||
.tab2 {
|
||||
box-sizing: border-box;
|
||||
padding: 2rem;
|
||||
padding: 20rem;
|
||||
|
||||
.title {
|
||||
margin-top: @padding-page;
|
||||
margin-bottom: 1rem;
|
||||
margin-bottom: 10rem;
|
||||
color: @second-text-color;
|
||||
font-size: 1.2rem;
|
||||
font-size: 12rem;
|
||||
}
|
||||
}
|
||||
|
||||
@ -256,21 +256,21 @@ export default {
|
||||
.title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: 2rem;
|
||||
margin-bottom: 1rem;
|
||||
margin-top: 20rem;
|
||||
margin-bottom: 10rem;
|
||||
color: @second-text-color;
|
||||
font-size: 1.2rem;
|
||||
font-size: 12rem;
|
||||
|
||||
img {
|
||||
width: 1rem;
|
||||
width: 10rem;
|
||||
}
|
||||
}
|
||||
|
||||
.no-search {
|
||||
padding: 2rem;
|
||||
padding: 20rem;
|
||||
|
||||
.look-address-list {
|
||||
margin: 0 0 2rem 0;
|
||||
margin: 0 0 20rem 0;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
@ -278,9 +278,9 @@ export default {
|
||||
.left {
|
||||
background: @second-btn-color-tran;
|
||||
border-radius: 50%;
|
||||
padding: 1.2rem;
|
||||
width: 2.2rem;
|
||||
margin-right: 1.5rem;
|
||||
padding: 12rem;
|
||||
width: 22rem;
|
||||
margin-right: 15rem;
|
||||
}
|
||||
|
||||
.right {
|
||||
@ -290,17 +290,17 @@ export default {
|
||||
align-items: center;
|
||||
|
||||
img {
|
||||
width: 1.4rem;
|
||||
width: 14rem;
|
||||
}
|
||||
|
||||
.notice {
|
||||
.text1 {
|
||||
font-size: 1.4rem;
|
||||
margin-bottom: .5rem;
|
||||
font-size: 14rem;
|
||||
margin-bottom: 5rem;
|
||||
}
|
||||
|
||||
.text2 {
|
||||
font-size: 1.2rem;
|
||||
font-size: 12rem;
|
||||
color: @second-text-color;
|
||||
}
|
||||
}
|
||||
@ -309,18 +309,18 @@ export default {
|
||||
}
|
||||
|
||||
.is-search {
|
||||
padding: 0 2rem 2rem 2rem;
|
||||
padding: 0 20rem 20rem 20rem;
|
||||
|
||||
.tooltip {
|
||||
font-size: 1.2rem;
|
||||
margin-top: 2rem;
|
||||
font-size: 12rem;
|
||||
margin-top: 20rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: @second-text-color;
|
||||
|
||||
img {
|
||||
margin-right: 1rem;
|
||||
width: 1.5rem;
|
||||
margin-right: 10rem;
|
||||
width: 15rem;
|
||||
}
|
||||
|
||||
.searchKey {
|
||||
@ -340,30 +340,30 @@ export default {
|
||||
color: black;
|
||||
background: white;
|
||||
box-sizing: border-box;
|
||||
border-radius: .3rem;
|
||||
border-radius: 3rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
.body {
|
||||
padding: 2rem;
|
||||
padding: 20rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
img {
|
||||
height: 6rem;
|
||||
margin-bottom: 2rem;
|
||||
height: 60rem;
|
||||
margin-bottom: 20rem;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 1.6rem;
|
||||
font-size: 16rem;
|
||||
font-weight: bold;
|
||||
margin-bottom: 1rem;
|
||||
margin-bottom: 10rem;
|
||||
}
|
||||
|
||||
.desc {
|
||||
font-size: 1rem;
|
||||
font-size: 10rem;
|
||||
color: gray;
|
||||
}
|
||||
|
||||
@ -377,9 +377,9 @@ export default {
|
||||
.footer {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
height: 4rem;
|
||||
height: 40rem;
|
||||
border-top: 1px solid @footer-border-color;
|
||||
font-size: 1.4rem;
|
||||
font-size: 14rem;
|
||||
|
||||
div {
|
||||
display: flex;
|
||||
@ -400,15 +400,15 @@ export default {
|
||||
}
|
||||
|
||||
.more-option-dialog {
|
||||
font-size: 1.4rem;
|
||||
font-size: 14rem;
|
||||
|
||||
.space {
|
||||
height: 1rem;
|
||||
height: 10rem;
|
||||
background: whitesmoke;
|
||||
}
|
||||
|
||||
.row {
|
||||
height: 5rem;
|
||||
height: 50rem;
|
||||
color: black;
|
||||
background: white;
|
||||
box-sizing: border-box;
|
||||
@ -431,56 +431,56 @@ export default {
|
||||
color: black;
|
||||
background: white;
|
||||
box-sizing: border-box;
|
||||
border-radius: .3rem;
|
||||
border-radius: 3rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 2rem;
|
||||
padding: 20rem;
|
||||
|
||||
.img-account {
|
||||
|
||||
}
|
||||
|
||||
.close {
|
||||
top: 1rem;
|
||||
right: 1rem;
|
||||
top: 10rem;
|
||||
right: 10rem;
|
||||
position: absolute;
|
||||
background: @second-btn-color-tran;
|
||||
padding: .4rem;
|
||||
width: 1rem;
|
||||
padding: 4rem;
|
||||
width: 10rem;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.desc {
|
||||
margin-top: 2rem;
|
||||
margin-top: 20rem;
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
|
||||
.notice {
|
||||
margin-top: 2rem;
|
||||
margin-top: 20rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: @second-text-color;
|
||||
|
||||
img {
|
||||
margin-right: 1rem;
|
||||
width: 1rem;
|
||||
margin-right: 10rem;
|
||||
width: 10rem;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 100%;
|
||||
height: 4rem;
|
||||
border-radius: .3rem;
|
||||
margin-top: 2rem;
|
||||
height: 40rem;
|
||||
border-radius: 3rem;
|
||||
margin-top: 20rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: white;
|
||||
|
||||
&:nth-last-child(1) {
|
||||
margin-top: 1rem;
|
||||
margin-top: 10rem;
|
||||
}
|
||||
|
||||
&.wechat {
|
||||
@ -492,8 +492,8 @@ export default {
|
||||
}
|
||||
|
||||
img {
|
||||
margin-right: 1rem;
|
||||
width: 1rem;
|
||||
margin-right: 10rem;
|
||||
width: 10rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -19,7 +19,7 @@
|
||||
v-model:active-index="slideIndex">
|
||||
</Indicator>
|
||||
</div>
|
||||
<SlideRowList v-model:active-index="slideIndex" style="height: calc(100vh - 11.1rem)">
|
||||
<SlideRowList v-model:active-index="slideIndex" style="height: calc(100vh - 111rem)">
|
||||
<SlideItem class="tab1">
|
||||
<Search v-model="searchKey" placeholder="搜索用户备注或名字" :is-show-right-text="false"/>
|
||||
<div class="is-search" v-if="searchKey">
|
||||
@ -117,7 +117,7 @@ export default {
|
||||
bottom: 0;
|
||||
top: 0;
|
||||
color: white;
|
||||
font-size: 1.4rem;
|
||||
font-size: 14rem;
|
||||
|
||||
.content {
|
||||
padding-top: @header-height;
|
||||
@ -133,7 +133,7 @@ export default {
|
||||
position: fixed;
|
||||
width: 100vw;
|
||||
box-sizing: border-box;
|
||||
padding: 1rem @padding-page 0 @padding-page;
|
||||
padding: 10rem @padding-page 0 @padding-page;
|
||||
}
|
||||
}
|
||||
|
||||
@ -147,17 +147,17 @@ export default {
|
||||
.title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 1rem;
|
||||
margin-bottom: 10rem;
|
||||
color: @second-text-color;
|
||||
font-size: 1.2rem;
|
||||
font-size: 12rem;
|
||||
}
|
||||
|
||||
.no-search {
|
||||
padding-top: 6rem;
|
||||
padding-top: 60rem;
|
||||
}
|
||||
|
||||
.is-search {
|
||||
padding-top: 5rem;
|
||||
padding-top: 50rem;
|
||||
|
||||
.no-result {
|
||||
display: flex;
|
||||
@ -165,18 +165,18 @@ export default {
|
||||
align-items: center;
|
||||
|
||||
img {
|
||||
margin-top: 15rem;
|
||||
height: 15rem;
|
||||
margin-top: 150rem;
|
||||
height: 150rem;
|
||||
}
|
||||
|
||||
.n1 {
|
||||
margin-top: 4rem;
|
||||
font-size: 1.6rem;
|
||||
margin-top: 40rem;
|
||||
font-size: 16rem;
|
||||
}
|
||||
|
||||
.n2 {
|
||||
margin-top: 2rem;
|
||||
font-size: 1.2rem;
|
||||
margin-top: 20rem;
|
||||
font-size: 12rem;
|
||||
color: @second-text-color;
|
||||
}
|
||||
}
|
||||
|
||||
@ -51,14 +51,14 @@ export default {
|
||||
|
||||
.back {
|
||||
z-index: 3;
|
||||
margin: 2rem 0 0 2rem;
|
||||
margin: 20rem 0 0 20rem;
|
||||
position: fixed;
|
||||
height: 2rem;
|
||||
height: 20rem;
|
||||
}
|
||||
|
||||
.float {
|
||||
position: fixed;
|
||||
bottom: 6rem;
|
||||
bottom: 60rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 80vw;
|
||||
@ -72,15 +72,15 @@ export default {
|
||||
img {
|
||||
border-radius: 50%;
|
||||
background: @second-btn-color-tran;
|
||||
padding: 1.6rem;
|
||||
height: 2.4rem;
|
||||
margin-bottom: 1rem;
|
||||
padding: 16rem;
|
||||
height: 24rem;
|
||||
margin-bottom: 10rem;
|
||||
}
|
||||
}
|
||||
|
||||
.open-light {
|
||||
position: fixed;
|
||||
bottom: 16rem;
|
||||
bottom: 160rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
@ -88,8 +88,8 @@ export default {
|
||||
transform: translateX(-50%);
|
||||
|
||||
img {
|
||||
height: 2.4rem;
|
||||
margin-bottom: 1rem;
|
||||
height: 24rem;
|
||||
margin-bottom: 10rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -154,15 +154,15 @@ export default {
|
||||
|
||||
.notice {
|
||||
color: @second-text-color;
|
||||
font-size: 1.2rem;
|
||||
height: 4rem;
|
||||
font-size: 12rem;
|
||||
height: 40rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.row {
|
||||
height: 5rem;
|
||||
height: 50rem;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
@ -178,7 +178,7 @@ export default {
|
||||
}
|
||||
|
||||
.space {
|
||||
height: 1rem;
|
||||
height: 10rem;
|
||||
background: whitesmoke;
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user