xwl2023/Yi.Framework
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 添加暗色主题支持

Browse Source 
- 在HTML根元素添加dark类名以启用暗色模式
- 引入Element Plus暗色主题CSS变量文件
- 格式化代码缩进和结构，提升代码可读性
This commit is contained in:
chenchun
2025-08-04 17:07:01 +08:00
parent 17f9ac6d54
commit 7f4b8f1c8a
2 changed files with 58 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

85
Yi.Bbs.Vue3/index.html
View File

@@ -1,47 +1,48 @@
<!DOCTYPE html>
<html lang="en">
<head>
<html lang="en" class="dark">
<head>
<meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<title>.Net意社区</title>
<!-- 为了，icp备案-->
<!-- <title>个人成果展示</title>-->
<link rel="stylesheet" href="/src/assets/loading.css" />
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-5453339688995325"
crossorigin="anonymous"></script>
</head>
<body>
<div id="Loading">
<div class="loader JS_on">
<span class="binary"></span>
<span class="binary"></span>
<span class="getting-there">意社区很大，你要等一下...</span>
</div>
</div>
<div id="app"></div>
<script type="module" src="/src/main.js"></script>
</body>
<title>.Net意社区</title>
<!-- 为了，icp备案-->
<!-- <title>个人成果展示</title>-->
<link rel="stylesheet" href="/src/assets/loading.css" />
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-5453339688995325" crossorigin="anonymous"></script>
</head>
<!-- 引入聊天组件脚本 -->
<script async src="https://opendeep.wiki/koala-chat-widget.js"></script>
<script>
function loadChatWidget() {
KoalaChatWidget.init({
appId: 'ccnetcore',
title: 'ccnetcore',
theme: 'light', // 或 'dark'
// 其他可选配置...
onError: (error) => {
console.error('Chat widget error:', error);
},
onValidationFailed: (domain) => {
console.error('Domain validation failed:', domain);
}
});
}
// 页面加载完成后再加载聊天组件
window.addEventListener('load', loadChatWidget);
</script>
</html>
<body>
<div id="Loading">
<div class="loader JS_on">
<span class="binary"></span>
<span class="binary"></span>
<span class="getting-there">意社区很大，你要等一下...</span>
</div>
</div>
<div id="app"></div>
<script type="module" src="/src/main.js"></script>
</body>
<!-- 引入聊天组件脚本 -->
<script async src="https://opendeep.wiki/koala-chat-widget.js"></script>
<script>
function loadChatWidget() {
KoalaChatWidget.init({
appId: 'ccnetcore',
title: 'ccnetcore',
theme: 'light', // 或 'dark'
// 其他可选配置...
onError: (error) => {
console.error('Chat widget error:', error);
},
onValidationFailed: (domain) => {
console.error('Domain validation failed:', domain);
}
});
}
// 页面加载完成后再加载聊天组件
window.addEventListener('load', loadChatWidget);
</script>
</html>

30
Yi.Bbs.Vue3/src/main.js
View File

@@ -8,7 +8,7 @@ import piniaPluginPersistedstate from "pinia-plugin-persistedstate";
import "element-plus/dist/index.css";
import "./assets/main.css";
import "@/assets/styles/index.scss"; // global css
import 'element-plus/theme-chalk/dark/css-vars.css'
import * as ElementPlusIconsVue from "@element-plus/icons-vue";
import directive from "./directive"; // directive
@@ -16,17 +16,17 @@ import VueLuckyCanvas from '@lucky-canvas/vue'
import "./permission";
(async () => {
const app = createApp(App);
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
app.component(key, component);
}
const pinia = createPinia();
pinia.use(piniaPluginPersistedstate);
app.use(pinia);
directive(app);
app.use(router);
app.use(VueLuckyCanvas);
await router.isReady();
app.mount("#app");
})();
(async() => {
const app = createApp(App);
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
app.component(key, component);
}
const pinia = createPinia();
pinia.use(piniaPluginPersistedstate);
app.use(pinia);
directive(app);
app.use(router);
app.use(VueLuckyCanvas);
await router.isReady();
app.mount("#app");
})();