💄 调整样式,更加紧凑

This commit is contained in:
BTMuli
2023-12-22 22:43:18 +08:00
parent dc655d89da
commit 18fd7fe59f

View File

@@ -9,34 +9,34 @@
<span>{{ data.name }} {{ data.title }}</span> <span>{{ data.name }} {{ data.title }}</span>
<span>{{ data.description }}</span> <span>{{ data.description }}</span>
</div> </div>
<div class="twc-bi-grid"> <div class="twc-bi-grid1">
<div class="twc-bim-item"> <div class="twc-big-item">
<span>所属</span> <span>所属</span>
<span>{{ data.brief.camp }}</span> <span>{{ data.brief.camp }}</span>
</div> </div>
<div class="twc-bim-item"> <div class="twc-big-item">
<span>命之座</span> <span>命之座</span>
<span>{{ data.brief.constellation }}</span> <span>{{ data.brief.constellation }}</span>
</div> </div>
<div class="twc-bim-item"> <div class="twc-big-item">
<span>生日</span> <span>生日</span>
<span>{{ data.brief.birth }}</span> <span>{{ data.brief.birth }}</span>
</div> </div>
</div> </div>
<div class="twc-bi-grid"> <div class="twc-bi-grid2">
<div class="twc-bib-item"> <div class="twc-big-item">
<span>汉语CV</span> <span>汉语CV</span>
<span>{{ data.brief.cv.cn }}</span> <span>{{ data.brief.cv.cn }}</span>
</div> </div>
<div class="twc-bib-item"> <div class="twc-big-item">
<span>日语CV</span> <span>日语CV</span>
<span>{{ data.brief.cv.jp }}</span> <span>{{ data.brief.cv.jp }}</span>
</div> </div>
<div class="twc-bib-item"> <div class="twc-big-item">
<span>英语CV</span> <span>英语CV</span>
<span>{{ data.brief.cv.en }}</span> <span>{{ data.brief.cv.en }}</span>
</div> </div>
<div class="twc-bib-item"> <div class="twc-big-item">
<span>韩语CV</span> <span>韩语CV</span>
<span>{{ data.brief.cv.kr }}</span> <span>{{ data.brief.cv.kr }}</span>
</div> </div>
@@ -173,7 +173,7 @@ onMounted(async () => {
.twc-brief { .twc-brief {
display: flex; display: flex;
align-items: flex-end; align-items: flex-start;
column-gap: 10px; column-gap: 10px;
} }
@@ -201,27 +201,24 @@ onMounted(async () => {
opacity: 0.8; opacity: 0.8;
} }
.twc-bi-grid { .twc-bi-grid1 {
display: grid; display: grid;
column-gap: 10px; column-gap: 10px;
grid-template-columns: repeat(4, 1fr); grid-template-columns: repeat(3, 1fr);
} }
.twc-bim-item { .twc-bi-grid2 {
display: grid;
column-gap: 10px;
grid-template-columns: repeat(2, 1fr);
}
.twc-big-item {
display: flex; display: flex;
column-gap: 5px; column-gap: 5px;
} }
.twc-bim-item :nth-child(1) { .twc-big-item :nth-child(1) {
font-weight: bold;
}
.twc-bib-item {
display: flex;
flex-direction: column;
}
.twc-bib-item :nth-child(1) {
font-weight: bold; font-weight: bold;
} }