mirror of
https://github.com/BTMuli/TeyvatGuide.git
synced 2025-12-15 09:48:14 +08:00
💄 feat(theme): 页面主题切换完成
This commit is contained in:
@@ -3,7 +3,7 @@
|
||||
<TLoading :title="loadingTitle" />
|
||||
</div>
|
||||
<div v-else>
|
||||
<v-tabs v-model="tab" align-tabs="start" class="global-font mb-2">
|
||||
<v-tabs v-model="tab" align-tabs="start" class="anno-tab">
|
||||
<v-tab value="activity" title="活动公告" />
|
||||
<v-tab value="game" title="游戏公告" />
|
||||
<v-spacer />
|
||||
@@ -159,6 +159,12 @@ async function toJson (item: BTMuli.Genshin.Announcement.ListCard) {
|
||||
</script>
|
||||
|
||||
<style lang="css" scoped>
|
||||
.anno-tab {
|
||||
font-family: Genshin, serif;
|
||||
margin-bottom: 20px;
|
||||
color: var(--content-text-3)
|
||||
}
|
||||
|
||||
.anno-grid {
|
||||
font-family: Genshin, serif;
|
||||
display: grid;
|
||||
@@ -168,8 +174,8 @@ async function toJson (item: BTMuli.Genshin.Announcement.ListCard) {
|
||||
|
||||
.anno-card {
|
||||
border-radius: 10px;
|
||||
background: #faf7e8;
|
||||
color: #546d8b;
|
||||
background: var(--content-bg-2);
|
||||
color: var(--content-text-2);
|
||||
border-bottom: #4b5366 1px solid;
|
||||
}
|
||||
|
||||
@@ -193,7 +199,7 @@ async function toJson (item: BTMuli.Genshin.Announcement.ListCard) {
|
||||
|
||||
.anno-btn {
|
||||
margin-left: 5px;
|
||||
background: #546d8b;
|
||||
background: var(--btn-bg-3);
|
||||
color: #faf7e8;
|
||||
}
|
||||
|
||||
@@ -205,10 +211,10 @@ async function toJson (item: BTMuli.Genshin.Announcement.ListCard) {
|
||||
/* switch */
|
||||
.switch-btn {
|
||||
font-family: Genshin, serif;
|
||||
background: #ffca0a;
|
||||
background: var(--btn-bg-1);
|
||||
height: 40px;
|
||||
margin-right: 10px;
|
||||
margin-top: 5px;
|
||||
color: #546d8b;
|
||||
color: var(--content-text-3);
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -375,15 +375,15 @@ function delDB () {
|
||||
.config-list {
|
||||
margin: 10px;
|
||||
font-family: Genshin-Light, serif;
|
||||
background: #faf7e8;
|
||||
color: #546d8b;
|
||||
background: var(--content-bg-2);
|
||||
color: var(--content-text-3);
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.config-header {
|
||||
margin-top: 10px;
|
||||
font-family: Genshin, serif;
|
||||
background: #faf7e8;
|
||||
background: var(--content-bg-2);
|
||||
color: #fec90b;
|
||||
font-size: large;
|
||||
}
|
||||
@@ -393,7 +393,7 @@ function delDB () {
|
||||
height: 40px;
|
||||
margin-right: 15px;
|
||||
padding: 5px;
|
||||
background: #5b738f;
|
||||
background: var(--content-bg-3);
|
||||
border-radius: 10px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -143,7 +143,7 @@ function toOuter (item: BTMuli.Genshin.Wiki.Character.BriefInfo) {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: rgba(20, 20, 20, 0.5);
|
||||
background: rgb(20 20 20 / 50%);
|
||||
border-bottom-left-radius: 5px;
|
||||
border-bottom-right-radius: 5px;
|
||||
color: #fff;
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
<TLoading title="正在加载卡牌列表" />
|
||||
</div>
|
||||
<div v-else>
|
||||
<v-tabs v-model="tab" align-tabs="start" class="global-font">
|
||||
<v-tabs v-model="tab" align-tabs="start" class="cards-tab">
|
||||
<div v-show="!doSearch">
|
||||
<v-tab value="character" title="角色牌" />
|
||||
<v-tab value="action" title="行动牌" />
|
||||
@@ -145,6 +145,12 @@ async function searchCard () {
|
||||
}
|
||||
</script>
|
||||
<style lang="css" scoped>
|
||||
.cards-tab {
|
||||
font-family: Genshin,serif;
|
||||
margin-bottom: 20px;
|
||||
color: var(--content-text-3);
|
||||
}
|
||||
|
||||
.cards-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
|
||||
|
||||
@@ -142,7 +142,7 @@ function toOuter (item: BTMuli.Genshin.Wiki.Weapon.BriefInfo) {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: rgba(20, 20, 20, 0.5);
|
||||
background: rgb(20 20 20 / 50%);
|
||||
border-bottom-left-radius: 5px;
|
||||
border-bottom-right-radius: 5px;
|
||||
color: #fff;
|
||||
|
||||
Reference in New Issue
Block a user