mirror/MCSManager
2
0
Fork 1
mirror of https://github.com/MCSManager/MCSManager.git synced 2025-01-30 15:19:32 +08:00
Code Issues Packages Projects Releases Wiki Activity

Optimize: bg colorr

Browse Source
This commit is contained in:
Lazy 2024-02-05 16:09:44 +08:00
parent 41fbee2317
commit 4735c4011c
3 changed files with 7 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/components.d.ts vendored
View File

@ -65,7 +65,6 @@ declare module 'vue' {
ATypographyTitle: typeof import('ant-design-vue/es')['TypographyTitle']
AUpload: typeof import('ant-design-vue/es')['Upload']
BetweenMenus: typeof import('./src/components/BetweenMenus.vue')['default']
BgWarp: typeof import('./src/components/BgWarp.vue')['default']
BgWrap: typeof import('./src/components/BgWrap.vue')['default']
CardError: typeof import('./src/components/CardError.vue')['default']
CardOperator: typeof import('./src/components/CardOperator.vue')['default']

13
frontend/src/App.vue
View File

@ -9,7 +9,6 @@ import { Button, Select, Input, Table } from "ant-design-vue";
import MyselfInfoDialog from "./components/MyselfInfoDialog.vue";
import { closeAppLoading } from "./tools/dom";
import { useLayoutConfigStore } from "./stores/useLayoutConfig";
import BgWrap from "./components/BgWrap.vue";
const { isDarkTheme } = useAppConfigStore();
const { getSettingsConfig, hasBgImage } = useLayoutConfigStore();
@ -19,13 +18,16 @@ const GLOBAL_COMPONENTS = [InputDialogProvider, MyselfInfoDialog];
function setBackground(url: string) {
const body = document.querySelector("body");
if (body) {
body.style.backgroundImage = `url(${url})`;
body.style.backgroundSize = "cover";
body.style.backgroundPosition = "center";
body.style.backgroundRepeat = "no-repeat";
isDarkTheme()
? body.classList.add("app-dark-extend-theme")
: body.classList.add("app-light-extend-theme");
if (isDarkTheme()) {
body.style.backgroundImage = `linear-gradient(135deg, rgba(0,0,0,0.3), rgba(0,0,0,0.3) 100%), url(${url})`;
body.classList.add("app-dark-extend-theme");
} else {
body.style.backgroundImage = `linear-gradient(135deg, rgba(220,220,220,0.3), rgba(53,53,53,0.3) 100%), url(${url})`;
body.classList.add("app-light-extend-theme");
}
}
hasBgImage.value = true;
}
@ -49,7 +51,6 @@ onMounted(async () => {
</script>
<template>
<BgWrap v-if="hasBgImage" />
<AppConfigProvider :has-bg-image="hasBgImage">
<!-- App Container -->
<div class="global-app-container">

14
frontend/src/components/BgWrap.vue
View File

@ -1,14 +0,0 @@
<template>
<div class="global-bg-wrap"></div>
</template>
<style scoped>
.global-bg-wrap {
background-color: rgba(0, 0, 0, 0.348);
position: fixed;
left: 0px;
right: 0px;
bottom: 0px;
top: 0px;
}
</style>