Fun/TeyvatGuide
1
0
Fork 0
mirror of https://github.com/BTMuli/TeyvatGuide.git synced 2025-12-15 09:48:14 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(style): 稍微优化了下样式

Browse Source
This commit is contained in:
BTMuli
2023-03-12 21:37:56 +08:00
parent 706750fab3
commit 7349cc0558
2 changed files with 21 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
src/components/t-sidebar.vue
View File

@@ -7,57 +7,40 @@
<!-- todo 如果没有上一个页面，则灰色不可点击 --> <!-- todo 如果没有上一个页面，则灰色不可点击 -->
<v-list-item @click="back"> <v-list-item @click="back">
<v-list-item-action> <v-list-item-action>
<v-icon>mdi-arrow-left</v-icon> <v-icon color="rgb(205, 182, 145)">mdi-arrow-left</v-icon>
</v-list-item-action> </v-list-item-action>
</v-list-item> </v-list-item>
<!-- 第二个图标，负责收缩侧边栏 --> <!-- 第二个图标，负责收缩侧边栏 -->
<v-list-item @click="collapse"> <v-list-item @click="collapse">
<v-list-item-action> <v-list-item-action>
<v-icon>mdi-menu</v-icon> <v-icon color="rgb(205, 182, 145)">mdi-menu</v-icon>
</v-list-item-action> </v-list-item-action>
</v-list-item> </v-list-item>
<!-- 菜单项 --> <!-- 菜单项 -->
<v-list-item link href="/"> <v-list-item link href="/" title="首页">
<template v-slot:prepend> <template v-slot:prepend>
<img src="/source/UI/paimon.webp" alt="homeIcon" class="sideIcon" /> <img src="/source/UI/paimon.webp" alt="homeIcon" class="sideIcon" />
</template> </template>
<v-list-item-title v-show="!rail"> 首页 </v-list-item-title>
</v-list-item> </v-list-item>
<v-list-subheader v-show="!rail"> <v-list-item link href="/news" title="咨讯">
<v-icon>mdi-bug-outline</v-icon>
<span> 测试功能 </span>
</v-list-subheader>
<v-list-item link href="/news">
<template v-slot:prepend> <template v-slot:prepend>
<img src="/source/UI/news.webp" alt="newsIcon" class="sideIcon" /> <img src="/source/UI/news.webp" alt="newsIcon" class="sideIcon" />
</template> </template>
<v-list-item-title v-show="!rail"> 咨讯 </v-list-item-title>
</v-list-item> </v-list-item>
<v-list-subheader v-show="!rail"> <v-list-item link href="/achievements" title="成就">
<v-icon>mdi-cog-outline</v-icon>
<span> 开发功能 </span>
</v-list-subheader>
<v-list-item link href="/achievements">
<template v-slot:prepend> <template v-slot:prepend>
<img src="/source/UI/achievements.webp" alt="achievementsIcon" class="sideIcon" /> <img src="/source/UI/achievements.webp" alt="achievementsIcon" class="sideIcon" />
</template> </template>
<v-list-item-title v-show="!rail"> 成就 </v-list-item-title>
</v-list-item> </v-list-item>
<v-list-subheader v-show="!rail" @click="magicClick"> <v-list-item link href="/config" title="设置">
<v-icon>mdi-rocket-outline</v-icon>
<span> 预期功能 </span>
</v-list-subheader>
<v-list-item link href="/config">
<template v-slot:prepend> <template v-slot:prepend>
<v-icon>mdi-cog-outline</v-icon> <v-icon color="rgb(205, 182, 145)">mdi-cog-outline</v-icon>
</template> </template>
<v-list-item-title v-show="!rail"> 设置 </v-list-item-title>
</v-list-item> </v-list-item>
<v-list-item link href="/dev" v-show="showDev"> <v-list-item link href="/dev" v-show="showDev" title="开发">
<template v-slot:prepend> <template v-slot:prepend>
<v-icon>mdi-bug-outline</v-icon> <v-icon>mdi-bug-outline</v-icon>
</template> </template>
<v-list-item-title v-show="!rail"> 开发 </v-list-item-title>
</v-list-item> </v-list-item>
</v-list> </v-list>
</v-navigation-drawer> </v-navigation-drawer>
@@ -88,13 +71,14 @@ function collapse() {
appStore.sidebar = rail.value; appStore.sidebar = rail.value;
} }
function magicClick() { function magicClick() {
if (!showDev.value) { // 打包的时候不显示开发功能
devStore.magicCount++; // if (!showDev.value) {
if (devStore.magicCount >= 10) { // devStore.magicCount++;
showDev.value = true; // if (devStore.magicCount >= 10) {
devStore.showDev = true; // showDev.value = true;
} // devStore.showDev = true;
} // }
// }
} }
</script> </script>
@@ -102,5 +86,6 @@ function magicClick() {
.sideIcon { .sideIcon {
width: 24px; width: 24px;
height: 24px; height: 24px;
margin-right: 32px;
} }
</style> </style>

5
src/pages/Achievements.vue
View File

@@ -70,7 +70,10 @@
style="margin-bottom: 10px" style="margin-bottom: 10px"
> >
<v-list> <v-list>
<v-list-item prepend-icon="mdi-trophy-variant-outline"> <v-list-item>
<template v-slot:prepend>
<v-icon color="rgb(205, 182, 145)">mdi-trophy-variant-outline</v-icon>
</template>
<v-list-item-title>{{ achievement.name }}</v-list-item-title> <v-list-item-title>{{ achievement.name }}</v-list-item-title>
<v-list-item-subtitle>{{ <v-list-item-subtitle>{{
achievement.completed ? achievement.completed_time : achievement.description achievement.completed ? achievement.completed_time : achievement.description