未验证 提交 189bc6fe 编写于 作者: 周旭 提交者: GitHub

feat: Added support for tailwindcss night mode mechanism (#998)

* feat: 新增支持 tailwindcss 的夜间模式支持

(cherry picked from commit 1de8704b61c38c92bc6877d0bec9e6f67766b3c8)

* docs: update changelog
上级 a544dd3e
### ✨ Features
- **Preview** 添加新的属性及事件
- **Dark Theme** 新增对 tailwindcss 夜间模式的支持
### 🐛 Bug Fixes
......
import { darkCssIsReady, loadDarkThemeCss } from 'vite-plugin-theme/es/client';
import { addClass, hasClass, removeClass } from '/@/utils/domUtils';
export async function updateDarkTheme(mode: string | null = 'light') {
const htmlRoot = document.getElementById('htmlRoot');
if (!htmlRoot) {
return;
}
const hasDarkClass = hasClass(htmlRoot, 'dark');
if (mode === 'dark') {
if (import.meta.env.PROD && !darkCssIsReady) {
await loadDarkThemeCss();
}
htmlRoot?.setAttribute('data-theme', 'dark');
htmlRoot.setAttribute('data-theme', 'dark');
if (!hasDarkClass) {
addClass(htmlRoot, 'dark');
}
} else {
htmlRoot?.setAttribute('data-theme', 'light');
htmlRoot.setAttribute('data-theme', 'light');
if (hasDarkClass) {
removeClass(htmlRoot, 'dark');
}
}
}
module.exports = {
mode: 'jit',
// darkMode: 'class',
darkMode: 'class',
plugins: [createEnterPlugin()],
purge: {
enable: process.env.NODE_ENV === 'production',
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册