hy/aslan-h5
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/components/WeeklyStar/topUser.vue
View File

@ -58,7 +58,17 @@
style="height: 36%; display: flex; justify-content: center; align-items: center" style="height: 36%; display: flex; justify-content: center; align-items: center"
:style="{ width: isTopOne ? '30%' : '40%' }" :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 }} {{ distributionValue }}
</div> </div>
</div> </div>

29
src/views/TopList/TopList.vue
View File

@ -213,10 +213,10 @@
</div> </div>
<div <div
style=" style="
width: 28%; width: 24%;
aspect-ratio: 1/1; aspect-ratio: 1/1;
border-radius: 50%; border-radius: 50%;
margin: 0 8px; margin: 0 5px;
background: linear-gradient( background: linear-gradient(
to bottom, to bottom,
rgba(255, 224, 60, 1), rgba(255, 224, 60, 1),
@ -237,7 +237,7 @@
</div> </div>
<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 <div
style=" style="
@ -252,13 +252,15 @@
> >
{{ listItem.userNickname }} {{ listItem.userNickname }}
</div> </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> </div>
<div style="display: flex; width: 30%; display: flex; align-items: center"> <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%" />
<div style="color: #edb247; font-weight: 700"> <div style="color: #edb247; font-weight: 700" class="topUserNickname">
{{ listItem.quantity }} {{ listItem.quantity }}
</div> </div>
</div> </div>
@ -567,7 +569,7 @@
<div style="color: #edb247; font-weight: 700">{{ myRanking.wealthRank || 0 }}</div> <div style="color: #edb247; font-weight: 700">{{ myRanking.wealthRank || 0 }}</div>
<div <div
style=" style="
width: 30%; width: 24%;
aspect-ratio: 1/1; aspect-ratio: 1/1;
border-radius: 50%; border-radius: 50%;
margin: 0 12px; margin: 0 12px;
@ -594,15 +596,12 @@
</div> </div>
<div style="display: flex; width: 30%; display: flex; align-items: center"> <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:女 --> <!-- 1:男,0:女 -->
<div <div v-if="myRanking.userSex == 1" style="color: #edb247; font-weight: 700">
v-if="myRanking.userSex == 1"
style="color: #edb247; font-weight: 700; margin-left: 8px"
>
{{ myRanking.wealthQuantity }} {{ myRanking.wealthQuantity }}
</div> </div>
<div v-else style="color: #edb247; font-weight: 700; margin-left: 8px"> <div v-else style="color: #edb247; font-weight: 700">
{{ myRanking.charmQuantity }} {{ myRanking.charmQuantity }}
</div> </div>
</div> </div>
@ -1098,6 +1097,10 @@ onUnmounted(() => {
font-weight: 860; font-weight: 860;
} }
.topUserNickname {
font-size: 0.8em;
}
.topUserNickname::-webkit-scrollbar { .topUserNickname::-webkit-scrollbar {
display: none; display: none;
} }

14
src/views/WeeklyStar/WeeklyStar.vue
View File

@ -139,7 +139,7 @@
</div> </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" /> <img :src="images.itemUser" alt="" width="100%;" style="display: block" />
<div <div
style=" style="
@ -150,18 +150,18 @@
right: 0; right: 0;
display: flex; display: flex;
align-items: center; align-items: center;
padding: 0 5%; padding: 0 3%;
" "
> >
<div style="width: 100%; display: flex; align-items: center"> <div style="width: 100%; display: flex; align-items: center">
<div style="color: #edb247; font-weight: 700; width: 15%" class="UserNickname"> <div style="color: #edb247; font-weight: 700; width: 10%" class="UserNickname">
{{ listItem.rank }} {{ listItem.rank }}99
</div> </div>
<img <img
:src="listItem.userAvatar || ''" :src="listItem.userAvatar || ''"
alt="" alt=""
style=" style="
width: 28%; width: 20%;
margin: 0 2%; margin: 0 2%;
aspect-ratio: 1/1; aspect-ratio: 1/1;
border-radius: 50%; border-radius: 50%;
@ -484,7 +484,7 @@
<!-- 贡献值 --> <!-- 贡献值 -->
<div style="width: 30%; display: flex; justify-content: center; align-items: center"> <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%" /> <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 }} {{ myRanking.quantity || 0 }}
</div> </div>
</div> </div>
@ -1300,7 +1300,7 @@ onUnmounted(() => {
} }
.UserNickname { .UserNickname {
font-size: 0.9em; font-size: 0.8em;
} }
@media screen and (max-width: 360px) { @media screen and (max-width: 360px) {