Fun/TeyvatGuide
1
0
Fork 0
mirror of https://github.com/BTMuli/TeyvatGuide.git synced 2026-04-01 06:39:45 +08:00
Code Issues Packages Projects Releases Wiki Activity

🎨 深渊页面美化，也没什么好改的了

Browse Source
This commit is contained in:
BTMuli
2023-06-14 13:46:17 +08:00
parent 09f0ff329e
commit 4504466869
5 changed files with 64 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/userAbyss/tua-detail-level.vue
View File

@@ -19,7 +19,7 @@ const props = defineProps<TuaDetailLevelProps>();
.tud-dl-divider {
border-radius: 5px;
width: 100%;
height: 2px;
background: rgb(255 255 255 / 50%);
height: 1px;
background: var(--common-color-white);
}
</style>

17
src/components/userAbyss/tua-detail-title.vue
View File

@@ -28,7 +28,10 @@ const props = withDefaults(defineProps<TuaDetailTitleProps>(), {
});
const getFont: ComputedRef<string> = computed(() => {
return props.mode === "level" ? "Genshin-Light, serif" : "Genshin, serif";
return props.mode === "level" ? "var(--font-text)" : "var(--font-title)";
});
const getFontSize: ComputedRef<string> = computed(() => {
return props.mode === "level" ? "18px" : "20px";
});
</script>
<style lang="css" scoped>
@@ -42,17 +45,17 @@ const getFont: ComputedRef<string> = computed(() => {
}
.tud-t-title {
font-size: 20px;
color: rgb(255 255 255 / 80%);
text-shadow: 0 0 10px rgb(0 0 0 / 80%);
font-size: v-bind(getFontSize);
color: var(--common-color-white);
text-shadow: 0 0 10px rgb(0 0 0 / 20%);
}
.tud-t-val {
display: flex;
align-items: center;
font-family: Genshin-Light, serif;
font-size: 20px;
color: rgb(255 255 255 / 80%);
font-family: var(--font-text);
font-size: v-bind(getFontSize);
color: var(--common-color-white);
text-shadow: #fec90b 0 0 5px;
}

2
src/components/userAbyss/tua-detail.vue
View File

@@ -22,7 +22,7 @@ const props = defineProps<TuaDetailProps>();
width: 100%;
margin-bottom: 10px;
border-radius: 5px;
background: rgb(0 0 0 / 10%);
background: var(--common-bg);
padding: 10px;
}

19
src/components/userAbyss/tua-overview.vue
View File

@@ -37,12 +37,11 @@ const props = withDefaults(defineProps<TAOProps>(), {
</script>
<style lang="css" scoped>
.tuao-box {
width: 33%;
width: 100%;
height: auto;
padding: 10px;
margin-bottom: 10px;
border-radius: 5px;
background: rgb(0 0 0 / 10%);
background: var(--common-bg);
display: flex;
flex-direction: column;
justify-content: center;
@@ -50,19 +49,17 @@ const props = withDefaults(defineProps<TAOProps>(), {
}
.tuao-title {
font-family: Genshin, serif;
font-family: var(--font-title);
font-size: 20px;
color: rgb(255 255 255 / 80%);
text-shadow: 0 0 10px rgb(0 0 0 / 80%);
color: var(--common-color-white);
text-shadow: 0 0 10px rgb(0 0 0 / 20%);
}
.tuao-val-text {
font-family: Genshin-Light, serif;
font-family: var(--font-text);
font-size: 20px;
font-weight: bold;
margin-top: 10px;
color: rgb(255 255 255 / 80%);
text-shadow: #fec90b 0 0 5px;
color: var(--common-color-white);
text-shadow: #fec90b 0 0 10px;
}
.tuao-val-icons {