/* disciplinaryMap/css/theme.css */ /* ========== 主题机制 ========== */ :root { /* 这里只声明变量，不赋值 */ --color-primary: ; --color-primary-light: ; --color-primary-dark: ; --color-primary-rgb: ; --color-background: ; --color-background-light: ; --color-background-card: ; --color-background-alt: ; --color-background-cream: ; --color-background-soft: ; --color-background-warm: ; --color-background-cream-dark: ; --color-text: ; --color-text-light: ; --color-text-secondary: ; --color-text-muted: ; --color-text-dark: ; --color-text-medium: ; --color-border: ; --color-border-light: ; --color-border-specialty: ; --color-border-cream: ; --color-success: ; --color-warning: ; --color-error: ; --color-info: ; --color-ai-background: ; --color-ai-border: ; --color-ai-shadow: ; --color-ai-soft-blue: ; --color-ai-border-blue: ; --color-ai-text-blue: ; --color-ai-background-light: ; --color-ai-text-muted: ; --color-philosophy: ; --color-social: ; --color-natural: ; --color-engineering: ; --color-humanities: ; --color-default-discipline: ; --color-error-background: ; /* 这些不依赖于颜色主题的设置保留在这里 */ /* 阴影定义 */ --shadow-sm: 0 1px 3px rgba(0,0,0,0.1); --shadow-md: 0 4px 6px rgba(0,0,0,0.1); --shadow-lg: 0 10px 15px rgba(0,0,0,0.1); --shadow-inner: inset 0 2px 4px rgba(0,0,0,0.05); /* 字体大小定义 */ --font-size-xs: 0.75rem; /* 12px */ --font-size-sm: 0.875rem; /* 14px */ --font-size-base: 1rem; /* 16px */ --font-size-lg: 1.125rem; /* 18px */ --font-size-xl: 1.25rem; /* 20px */ --font-size-2xl: 1.5rem; /* 24px */ --font-size-3xl: 1.875rem; /* 30px */ --font-size-4xl: 2.25rem; /* 36px */ /* 字体粗细 */ --font-weight-normal: 400; --font-weight-medium: 500; --font-weight-bold: 700; /* 行高 */ --line-height-tight: 1.25; --line-height-normal: 1.5; --line-height-relaxed: 1.75; /* 过渡动画 */ --transition-fast: 0.15s; --transition-normal: 0.3s; --transition-slow: 0.5s; --easing-default: ease-in-out; } /* 默认使用咖啡色主题 */ :root { --theme-active: "coffee"; } /* 主题选择器：通过data-theme属性来应用不同主题 */ /* 在HTML的标签上设置: */ html[data-theme="coffee"] { --theme-active: "coffee"; } html[data-theme="ocean"] { --theme-active: "ocean"; } html[data-theme="forest"] { --theme-active: "forest"; } html[data-theme="berry"] { --theme-active: "berry"; } /* 主题切换动画 */ *, *::before, *::after { transition: background-color var(--transition-normal) ease, color var(--transition-normal) ease, border-color var(--transition-normal) ease; } /* 暗黑模式颜色 - 预留 */ @media (prefers-color-scheme: dark) { :root { /* 暗黑模式下可以在这里覆盖颜色变量 */ } }