73 lines
2.1 KiB
CSS
73 lines
2.1 KiB
CSS
/**
|
|
* AKSRT Theme Background System
|
|
*
|
|
* 全局背景图、夜间背景图、页面背景色/背景图。
|
|
* 所有选择器均带 aksrt- 命名空间。
|
|
*/
|
|
|
|
/* ========== 全局背景 ========== */
|
|
.aksrt-bg-body {
|
|
background-color: var(--aksrt-bg-color, transparent);
|
|
background-image: var(--aksrt-bg-image, none);
|
|
background-size: var(--aksrt-bg-size, cover);
|
|
background-position: var(--aksrt-bg-position, center center);
|
|
background-repeat: var(--aksrt-bg-repeat, no-repeat);
|
|
background-attachment: var(--aksrt-bg-attachment, fixed);
|
|
}
|
|
|
|
/* ========== 夜间模式背景 ========== */
|
|
.aksrt-bg-dark {
|
|
background-color: var(--aksrt-bg-dark-color, transparent);
|
|
background-image: var(--aksrt-bg-dark-image, none);
|
|
}
|
|
|
|
/* ========== 页面级背景 ========== */
|
|
.aksrt-bg-page {
|
|
background-color: var(--aksrt-page-bg-color, transparent);
|
|
background-image: var(--aksrt-page-bg-image, none);
|
|
background-size: cover;
|
|
background-position: center center;
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
/* ========== 模块级背景 ========== */
|
|
.aksrt-bg-module {
|
|
background-color: var(--aksrt-module-bg-color, transparent);
|
|
background-image: var(--aksrt-module-bg-image, none);
|
|
background-size: cover;
|
|
background-position: center center;
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
/* ========== 背景遮罩层(提升文字可读性)========== */
|
|
.aksrt-bg-overlay {
|
|
position: relative;
|
|
}
|
|
|
|
.aksrt-bg-overlay::before {
|
|
content: '';
|
|
position: absolute;
|
|
inset: 0;
|
|
background: var(--aksrt-bg-overlay-color, rgba(0, 0, 0, 0.3));
|
|
pointer-events: none;
|
|
z-index: 0;
|
|
}
|
|
|
|
.aksrt-bg-overlay > * {
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
/* ========== 暗色模式自动切换 ========== */
|
|
@media (prefers-color-scheme: dark) {
|
|
:root:not(.aksrt-light-mode) .aksrt-bg-body {
|
|
background-color: var(--aksrt-bg-dark-color, var(--aksrt-bg-color, transparent));
|
|
background-image: var(--aksrt-bg-dark-image, var(--aksrt-bg-image, none));
|
|
}
|
|
}
|
|
|
|
html.aksrt-dark-mode .aksrt-bg-body {
|
|
background-color: var(--aksrt-bg-dark-color, var(--aksrt-bg-color, transparent));
|
|
background-image: var(--aksrt-bg-dark-image, var(--aksrt-bg-image, none));
|
|
}
|