style(排行榜): 字体大小调整

This commit is contained in:
hzj 2025-09-26 11:27:52 +08:00
parent 96399c0448
commit c804900677
3 changed files with 34 additions and 21 deletions

View File

@ -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>

View File

@ -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;
}

View File

@ -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) {