You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
61 lines
1.9 KiB
61 lines
1.9 KiB
html,
|
|
body {
|
|
height: 100%;
|
|
}
|
|
|
|
/* 全局主题变量(使用 _theme-helpers.scss 中的 mixin/map)
|
|
- 在 :root 中生成默认亮色主题变量
|
|
- 支持手动切换(data-theme="dark" / .theme-dark)
|
|
- 保留 prefers-color-scheme 媒体查询用于自动切换
|
|
*/
|
|
|
|
// 亮色主题变量 map(键不带 -- 前缀)
|
|
$theme-light: (
|
|
"color-fg-default": #24292f,
|
|
"color-fg-muted": #57606a,
|
|
"color-fg-subtle": #6e7781,
|
|
"color-canvas-default": #ffffff,
|
|
"color-canvas-subtle": #f6f8fa,
|
|
"color-border-default": #d0d7de,
|
|
"color-border-muted": hsla(210, 18%, 87%, 1),
|
|
"color-neutral-muted": rgba(175, 184, 193, 0.2),
|
|
"color-accent-fg": #0969da,
|
|
"color-accent-emphasis": #0969da,
|
|
"color-attention-subtle": #fff8c5,
|
|
"color-danger-fg": #cf222e,
|
|
"color-mark-default": rgb(255, 255, 0),
|
|
"color-mark-fg": rgb(255, 187, 0),
|
|
);
|
|
|
|
// 暗色主题变量 map(对应亮色变量的语义)
|
|
$theme-dark: (
|
|
"color-fg-default": #c9d1d9,
|
|
"color-fg-muted": #8b949e,
|
|
"color-fg-subtle": #6e7681,
|
|
"color-canvas-default": #0d1117,
|
|
"color-canvas-subtle": #010409,
|
|
"color-border-default": #30363d,
|
|
"color-border-muted": hsla(210, 18%, 20%, 1),
|
|
"color-neutral-muted": rgba(175, 184, 193, 0.12),
|
|
"color-accent-fg": #58a6ff,
|
|
"color-accent-emphasis": #2389ff,
|
|
"color-attention-subtle": rgba(255, 214, 10, 0.07),
|
|
"color-danger-fg": #ff7b72,
|
|
"color-mark-default": rgb(255, 214, 10),
|
|
"color-mark-fg": rgb(255, 165, 0),
|
|
);
|
|
|
|
// 在 :root 中生成默认(亮色)变量,便于组件直接使用 css var
|
|
@include generate-theme(":root", $theme-light);
|
|
|
|
// 手动主题切换支持:data-theme 或 class
|
|
@include generate-theme(':root[data-theme="dark"]', $theme-dark);
|
|
@include generate-theme(".theme-light", $theme-light);
|
|
@include generate-theme(".theme-dark", $theme-dark);
|
|
|
|
#app {
|
|
height: 100%;
|
|
background-color: css-var(color-canvas-default);
|
|
color: css-var(color-fg-default);
|
|
line-height: 1.2;
|
|
}
|
|
|