52 lines
1.9 KiB
SCSS
52 lines
1.9 KiB
SCSS
@mixin light-theme() {
|
|
--titleColor: rgba(0, 0, 0, 0.9); // 标题
|
|
--summaryColor: rgba(0, 0, 0, 0.5); // 摘要
|
|
--descriptionColor: rgba(0, 0, 0, 0.3); // 描述
|
|
--contentBgColor: rgba(0, 0, 0, 0.1); // 内容区块
|
|
--auxiliaryBgColor: rgba(0, 0, 0, 0.05); // 辅助背景色
|
|
--dottedBorderColor: rgba(0, 0, 0, 0.15); // 虚线
|
|
--dividerColor: rgba(0, 0, 0, 0.1); // 分割线
|
|
--pageBgColor: #F5F5F5; // 页面背景
|
|
--containerBgColor: #FFFFFF; // 内容块背景
|
|
--importantColor: #E6521F; // 重要色
|
|
--themeColor: #2772F0; // 主题色
|
|
--themeColor30: rgba(39, 114, 240, 0.3);//主题色30%
|
|
--navbarBgColor: #FFFFFF; // 导航背景
|
|
|
|
--defaultUserAvatar: url("/static/img/default-user.png") no-repeat center / 100%;
|
|
--emptyData: url("https://jl-td.oss-cn-chengdu.aliyuncs.com/uploads/20241018/fda50c010550e9a93311de89e1e0b0e1.png") no-repeat center / 100%;
|
|
}
|
|
|
|
@mixin dark-theme() {
|
|
--titleColor: rgba(255, 255, 255, 0.9);
|
|
--summaryColor: rgba(255, 255, 255, 0.5);
|
|
--descriptionColor: rgba(255, 255, 255, 0.3);
|
|
--contentBgColor: rgba(255, 255, 255, 0.1);
|
|
--auxiliaryBgColor: rgba(255, 255, 255, 0.05);
|
|
--dottedBorderColor: rgba(255, 255, 255, 0.15);
|
|
--dividerColor: rgba(255, 255, 255, 0.1);
|
|
--pageBgColor: #111111;
|
|
--containerBgColor: #1E1E1E;
|
|
--importantColor: #E6521F;
|
|
--themeColor: #2772F0;
|
|
--themeColor30: rgba(39, 114, 240, 0.3);//主题色30%
|
|
--navbarBgColor: #1D1D1D;
|
|
|
|
--defaultUserAvatar: url("/static/img/default-user-dark.png") no-repeat center / 100%;
|
|
--emptyData: url("https://jl-td.oss-cn-chengdu.aliyuncs.com/uploads/20241018/6dbc6a080b19e70d3500e418db24eeb7.png") no-repeat center / 100%;
|
|
}
|
|
|
|
/*亮色模式-自动样式*/
|
|
@media (prefers-color-scheme: light) {
|
|
page {
|
|
@include light-theme();
|
|
}
|
|
}
|
|
|
|
/*暗黑模式-自动样式*/
|
|
@media (prefers-color-scheme: dark) {
|
|
page{
|
|
@include dark-theme();
|
|
}
|
|
}
|