style(排行榜): 字体大小调整
This commit is contained in:
parent
96399c0448
commit
c804900677
@ -58,7 +58,17 @@
|
||||
style="height: 36%; display: flex; justify-content: center; align-items: center"
|
||||
:style="{ width: isTopOne ? '30%' : '40%' }"
|
||||
>
|
||||
<div style="font-weight: 700" class="showText" :class="isTopOne ? 'top1Text' : 'text'">
|
||||
<div
|
||||
style="
|
||||
font-weight: 700;
|
||||
background: linear-gradient(180deg, #ffe656 0%, #fff 100%);
|
||||
background-clip: text;
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
"
|
||||
class="showText"
|
||||
:class="isTopOne ? 'top1Text' : 'text'"
|
||||
>
|
||||
{{ distributionValue }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -213,10 +213,10 @@
|
||||
</div>
|
||||
<div
|
||||
style="
|
||||
width: 28%;
|
||||
width: 24%;
|
||||
aspect-ratio: 1/1;
|
||||
border-radius: 50%;
|
||||
margin: 0 8px;
|
||||
margin: 0 5px;
|
||||
background: linear-gradient(
|
||||
to bottom,
|
||||
rgba(255, 224, 60, 1),
|
||||
@ -237,7 +237,7 @@
|
||||
</div>
|
||||
|
||||
<div
|
||||
style="width: calc(72% - 28px - 26px); display: flex; flex-direction: column"
|
||||
style="width: calc(100% - 24% - 10px); display: flex; flex-direction: column"
|
||||
>
|
||||
<div
|
||||
style="
|
||||
@ -252,13 +252,15 @@
|
||||
>
|
||||
{{ listItem.userNickname }}
|
||||
</div>
|
||||
<div style="color: #fff; font-weight: 590">ID:{{ listItem.account }}</div>
|
||||
<div style="color: #fff; font-weight: 590" class="topUserNickname">
|
||||
ID:{{ listItem.account }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="display: flex; width: 30%; display: flex; align-items: center">
|
||||
<img src="/src/assets/icon/coin.png" alt="" style="width: 20%; height: 20%" />
|
||||
<div style="color: #edb247; font-weight: 700">
|
||||
<img src="/src/assets/icon/coin.png" alt="" style="width: 25%" />
|
||||
<div style="color: #edb247; font-weight: 700" class="topUserNickname">
|
||||
{{ listItem.quantity }}
|
||||
</div>
|
||||
</div>
|
||||
@ -567,7 +569,7 @@
|
||||
<div style="color: #edb247; font-weight: 700">{{ myRanking.wealthRank || 0 }}</div>
|
||||
<div
|
||||
style="
|
||||
width: 30%;
|
||||
width: 24%;
|
||||
aspect-ratio: 1/1;
|
||||
border-radius: 50%;
|
||||
margin: 0 12px;
|
||||
@ -594,15 +596,12 @@
|
||||
</div>
|
||||
|
||||
<div style="display: flex; width: 30%; display: flex; align-items: center">
|
||||
<img src="/src/assets/icon/coin.png" alt="" style="width: 20%; height: 20%" />
|
||||
<img src="/src/assets/icon/coin.png" alt="" style="width: 25%; height: 20%" />
|
||||
<!-- 1:男,0:女 -->
|
||||
<div
|
||||
v-if="myRanking.userSex == 1"
|
||||
style="color: #edb247; font-weight: 700; margin-left: 8px"
|
||||
>
|
||||
<div v-if="myRanking.userSex == 1" style="color: #edb247; font-weight: 700">
|
||||
{{ myRanking.wealthQuantity }}
|
||||
</div>
|
||||
<div v-else style="color: #edb247; font-weight: 700; margin-left: 8px">
|
||||
<div v-else style="color: #edb247; font-weight: 700">
|
||||
{{ myRanking.charmQuantity }}
|
||||
</div>
|
||||
</div>
|
||||
@ -1098,6 +1097,10 @@ onUnmounted(() => {
|
||||
font-weight: 860;
|
||||
}
|
||||
|
||||
.topUserNickname {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
.topUserNickname::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@ -139,7 +139,7 @@
|
||||
</div>
|
||||
|
||||
<!-- 第四名开始 -->
|
||||
<div v-for="listItem in showRanking" style="margin-top: 2%; position: relative">
|
||||
<div v-for="listItem in showRanking" style="margin-top: 3%; position: relative">
|
||||
<img :src="images.itemUser" alt="" width="100%;" style="display: block" />
|
||||
<div
|
||||
style="
|
||||
@ -150,18 +150,18 @@
|
||||
right: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 5%;
|
||||
padding: 0 3%;
|
||||
"
|
||||
>
|
||||
<div style="width: 100%; display: flex; align-items: center">
|
||||
<div style="color: #edb247; font-weight: 700; width: 15%" class="UserNickname">
|
||||
{{ listItem.rank }}
|
||||
<div style="color: #edb247; font-weight: 700; width: 10%" class="UserNickname">
|
||||
{{ listItem.rank }}99
|
||||
</div>
|
||||
<img
|
||||
:src="listItem.userAvatar || ''"
|
||||
alt=""
|
||||
style="
|
||||
width: 28%;
|
||||
width: 20%;
|
||||
margin: 0 2%;
|
||||
aspect-ratio: 1/1;
|
||||
border-radius: 50%;
|
||||
@ -484,7 +484,7 @@
|
||||
<!-- 贡献值 -->
|
||||
<div style="width: 30%; display: flex; justify-content: center; align-items: center">
|
||||
<img src="/src/assets/icon/coin.png" alt="" style="width: 20%; height: 20%" />
|
||||
<div style="color: #edb247; font-weight: 700; margin-left: 8px">
|
||||
<div style="color: #edb247; font-weight: 700">
|
||||
{{ myRanking.quantity || 0 }}
|
||||
</div>
|
||||
</div>
|
||||
@ -1300,7 +1300,7 @@ onUnmounted(() => {
|
||||
}
|
||||
|
||||
.UserNickname {
|
||||
font-size: 0.9em;
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 360px) {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user