sight-wcg / layui-theme-dark Goto Github PK

我在导航菜单添加样式layui-bg-gray之后，当开启深色模式，依旧是浅色的，我查看元素发现layui-bg-gray使用了!important，所以建议在深色模式下也加上!important

• button
• element.nav
• element.tab
• form
• menu
• progress
• badge
• timeline
• auxiliar
• table
• layer
• laydate
• laypage
• upload
• dropdown
• transfer
• tree
• colorpicker
• slider
• rate
• carousel
• flow
• util
• code

目前第一版是提取颜色 rule 算法生成的，效果还可以。接下来将使用 css 变量重构，方便二次定制。
低版本浏览器使用插件转换或 css-vars-ponyfill

// before
color: var(--lay-red)；
// after
color: #FF7948；
color: var(--lay-red)；

建议整体加个媒体查询，这样的话，可以跟随浏览器主题自动变色

@media (prefers-color-scheme: dark) {
/*css内容*/
}