💄 微调样式

This commit is contained in:
BTMuli
2023-11-21 16:23:14 +08:00
parent 92a1775d19
commit d6ae3765b6

View File

@@ -58,9 +58,7 @@
class="card-achi" class="card-achi"
:title="allSeriesData.find((item) => item.id === achievement.series)?.name ?? ''" :title="allSeriesData.find((item) => item.id === achievement.series)?.name ?? ''"
> >
<div v-if="achievement.progress !== 0" class="achi-progress"> <div class="achi-version">v{{ achievement.version }}</div>
{{ achievement.progress }}
</div>
<div class="achi-pre"> <div class="achi-pre">
<div class="achi-pre-icon"> <div class="achi-pre-icon">
<v-icon <v-icon
@@ -81,9 +79,11 @@
</v-icon> </v-icon>
</div> </div>
<div class="achi-pre-info"> <div class="achi-pre-info">
<span <span>
>{{ achievement.name }} <span>{{ achievement.name }}</span>
<span>v{{ achievement.version }}</span> <span v-if="achievement.progress !== 0">
{{ achievement.progress }}
</span>
</span> </span>
<span>{{ achievement.description }}</span> <span>{{ achievement.description }}</span>
</div> </div>
@@ -577,6 +577,7 @@ async function setAchiDB(achievement: TGApp.Sqlite.Achievement.SingleTable): Pro
border-top: 1px solid var(--common-shadow-1); border-top: 1px solid var(--common-shadow-1);
border-left: 1px solid var(--common-shadow-1); border-left: 1px solid var(--common-shadow-1);
background: var(--box-bg-2); background: var(--box-bg-2);
border-bottom-right-radius: 10px;
border-top-left-radius: 20px; border-top-left-radius: 20px;
color: var(--tgc-yellow-1); color: var(--tgc-yellow-1);
font-family: var(--font-title); font-family: var(--font-title);
@@ -601,6 +602,7 @@ async function setAchiDB(achievement: TGApp.Sqlite.Achievement.SingleTable): Pro
flex-flow: column wrap; flex-flow: column wrap;
align-items: flex-start; align-items: flex-start;
justify-content: center; justify-content: center;
color: var(--box-text-1);
text-align: left; text-align: left;
} }
@@ -641,7 +643,7 @@ async function setAchiDB(achievement: TGApp.Sqlite.Achievement.SingleTable): Pro
} }
/* 成就进度 */ /* 成就进度 */
.achi-progress { .achi-version {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
@@ -650,7 +652,8 @@ async function setAchiDB(achievement: TGApp.Sqlite.Achievement.SingleTable): Pro
border-bottom: 1px solid var(--common-shadow-1); border-bottom: 1px solid var(--common-shadow-1);
background: var(--box-bg-2); background: var(--box-bg-2);
border-bottom-right-radius: 20px; border-bottom-right-radius: 20px;
color: var(--box-text-3); border-top-left-radius: 10px;
color: var(--tgc-pink-1);
font-family: var(--font-title); font-family: var(--font-title);
font-size: 10px; font-size: 10px;
text-align: center; text-align: center;
@@ -687,10 +690,23 @@ async function setAchiDB(achievement: TGApp.Sqlite.Achievement.SingleTable): Pro
} }
.achi-pre-info :nth-child(1) { .achi-pre-info :nth-child(1) {
display: flex;
align-items: flex-end;
column-gap: 5px;
font-family: var(--font-title); font-family: var(--font-title);
font-size: 14px; font-size: 14px;
} }
.achi-pre-info :nth-child(1) :nth-child(2) {
color: var(--tgc-blue-2);
font-size: 12px;
}
.achi-pre-info :nth-child(2) {
font-size: 12px;
opacity: 0.8;
}
.achi-append-icon span { .achi-append-icon span {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
@@ -701,20 +717,12 @@ async function setAchiDB(achievement: TGApp.Sqlite.Achievement.SingleTable): Pro
align-items: center; align-items: center;
justify-content: center; justify-content: center;
background: rgb(0 0 0 / 50%); background: rgb(0 0 0 / 50%);
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
color: var(--tgc-white-1); color: var(--tgc-white-1);
font-size: 8px; font-size: 8px;
} }
.achi-pre-info :nth-child(1) span {
color: var(--tgc-pink-1);
font-size: 12px;
}
.achi-pre-info :nth-child(2) {
font-size: 12px;
opacity: 0.8;
}
.achi-append { .achi-append {
display: flex; display: flex;
align-items: center; align-items: center;