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

fix(style): 样式优化

Browse Source
This commit is contained in:
BTMuli
2023-03-14 14:17:21 +08:00
parent b5091f3461
commit 2295927082
3 changed files with 32 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/pages/Achievements.vue
View File

@@ -3,20 +3,13 @@
<v-app-bar app>
<template v-slot:prepend>
<!-- 标题 -->
<v-card-text class="text-h5;global-font">{{ title }}</v-card-text>
<v-card-text class="top-title">{{ title }}</v-card-text>
</template>
<template v-slot:append>
<!-- 导入按钮 -->
<v-btn
@click="importJson"
prepend-icon="mdi-import"
class="bg-green-accent-2;global-font;global-font;"
title="导入"
/>
<v-btn @click="importJson" prepend-icon="mdi-import" class="ms-2 top-btn">导入</v-btn>
<!-- 导出按钮 -->
<v-btn @click="exportJson" prepend-icon="mdi-export" class="ms-2 bg-green-accent-2">
导出
</v-btn>
<v-btn @click="exportJson" prepend-icon="mdi-export" class="ms-2 top-btn"> 导出 </v-btn>
</template>
</v-app-bar>
<!-- todo 列表加载速度优化，主要是天地万象的数据量太大了 -->
@@ -286,20 +279,32 @@ async function exportJson() {
</script>
<style lang="css">
/*内容区域 todo @media*/
/* 顶部标题 */
.top-title {
font-family: Genshin, "serif";
font-size: 30px;
}
/* 顶部按钮 */
.top-btn {
font-family: Genshin, "serif";
background: #393b40;
color: #f4d8a8 !important;
}
/* 内容区域 */
.wrap-view {
overflow: auto;
height: 840px;
border-bottom: 2px solid #e6e6e6;
font-family: Genshin, "serif";
}
/*左侧系列*/
/* 左侧系列 */
.left-wrap {
height: 100%;
overflow: auto;
}
/*右侧成就*/
/* 右侧成就 */
.right-wrap {
height: 100%;
overflow: auto;

6
src/pages/Config.vue
View File

@@ -23,7 +23,7 @@
<v-list-item>
<v-list-item-title>咨讯页渲染模式</v-list-item-title>
<v-list-item-subtitle
>样式上 raw 数据渲染更为合适，如果帖子有视频，建议采用结构化渲染</v-list-item-subtitle
>推荐采用结构化渲染，当出现内容缺失时建议采用 raw 渲染</v-list-item-subtitle
>
<template v-slot:append>
<v-switch
@@ -31,7 +31,7 @@
inset
v-model="renderBool"
@click="changeRenderMode"
color="primary"
color="#1E96D5"
/>
</template>
</v-list-item>
@@ -64,7 +64,7 @@ const appStore = useAppStore();
const achievementsStore = useAchievementsStore();
const renderBool = ref(appStore.structureRender);
const renderMode = ref(renderBool.value ? "结构化渲染" : " raw 渲染")
const renderMode = ref(renderBool.value ? "结构化渲染" : " raw 渲染");
// 切换渲染模式
function changeRenderMode() {

17
src/pages/News.vue
View File

@@ -18,7 +18,7 @@
<v-btn
@click="toPost(item.post_id)"
prepend-icon="mdi-arrow-right-circle"
class="ms-2 bg-blue-accent-2"
class="ms-2 card-btn"
>查看</v-btn
>
<v-card-subtitle>id:{{ item.post_id }}</v-card-subtitle>
@@ -26,7 +26,7 @@
v-show="showLog"
@click="logPost(item.post_id)"
prepend-icon="mdi-arrow-right-circle"
class="ms-2 bg-blue-accent-2"
class="ms-2 card-btn"
>原始数据</v-btn
>
</v-card-actions>
@@ -47,7 +47,7 @@
<v-btn
@click="toPost(item.post_id)"
prepend-icon="mdi-arrow-right-circle"
class="ms-2 bg-blue-accent-2"
class="ms-2 card-btn"
>查看</v-btn
>
<v-btn v-if="item.status === 1" color="ms-2 bg-green-accent-1" variant="flat" disabled
@@ -65,7 +65,7 @@
v-show="showLog"
@click="logPost(item.post_id)"
prepend-icon="mdi-arrow-right-circle"
class="ms-2 bg-blue-accent-2"
class="ms-2 card-btn"
>原始数据</v-btn
>
</v-card-actions>
@@ -79,9 +79,9 @@
<v-card-title>{{ item.title }}</v-card-title>
<v-card-actions>
<v-btn
class="ms-2 card-btn"
@click="toPost(item.post_id)"
prepend-icon="mdi-arrow-right-circle"
class="ms-2 bg-blue-accent-2"
>查看</v-btn
>
<v-card-subtitle>id:{{ item.post_id }}</v-card-subtitle>
@@ -89,7 +89,7 @@
v-show="showLog"
@click="logPost(item.post_id)"
prepend-icon="mdi-arrow-right-circle"
class="ms-2 bg-blue-accent-2"
class="ms-2 card-btn"
>原始数据</v-btn
>
</v-card-actions>
@@ -235,4 +235,9 @@ async function getPost(post_id: string): Promise<ResponsePost> {
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
grid-gap: 20px;
}
.card-btn {
background: #ffe14c !important;
color: #704a1d !important;
}
</style>