/* page-theme.css — 按页面区分背景色 + 导航条/页头跟随换色 ======================================================== - 每个页面（）使用不同的柔和底色渐变（与之前一致）。 - 同时为本页面定义一套「主题色」变量（--subject / --primary 系列），使导航条激活态、logo、页头渐变、按钮、卡片顶条等整体跟随页面换色，一眼即可区分当前所在模块。 - 变量由 app.py inject_user 按路由端点前缀写入 g.page_key 并渲染到 body[data-page]。 - 本文件在 style.css / subject.css / global-polish.css 之后加载，可覆盖统一靛蓝主题色。 */ /* 默认（兜底）：中性灰 */ body[data-page] { --subject: #64748b; --subject-2: #475569; --subject-light: #f1f5f9; --primary: #64748b; --primary-light: #f1f5f9; --primary-dark: #475569; background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%); } /* 首页 — 靛蓝 */ body[data-page="index"] { --subject: #4f46e5; --subject-2: #4338ca; --subject-light: #eef2ff; --primary: #4f46e5; --primary-light: #eef2ff; --primary-dark: #4338ca; background: linear-gradient(135deg, #eef2ff 0%, #faf5ff 100%); } /* 题库浏览 / 题目管理 — 紫 */ body[data-page="questions"] { --subject: #7c3aed; --subject-2: #6d28d9; --subject-light: #f3e8ff; --primary: #7c3aed; --primary-light: #f3e8ff; --primary-dark: #6d28d9; background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 100%); } /* 组卷 — 青 */ body[data-page="paper"] { --subject: #0891b2; --subject-2: #0e7490; --subject-light: #cffafe; --primary: #0891b2; --primary-light: #cffafe; --primary-dark: #0e7490; background: linear-gradient(135deg, #ecfeff 0%, #e0f2fe 100%); } /* 阅卷 / 批改 — 琥珀 */ body[data-page="grading"] { --subject: #d97706; --subject-2: #b45309; --subject-light: #fef3c7; --primary: #d97706; --primary-light: #fef3c7; --primary-dark: #b45309; background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%); } /* 成绩分析 — 玫红 */ body[data-page="analysis"] { --subject: #db2777; --subject-2: #be185d; --subject-light: #fce7f3; --primary: #db2777; --primary-light: #fce7f3; --primary-dark: #be185d; background: linear-gradient(135deg, #fff1f2 0%, #ffe4e6 100%); } /* 班级管理 — 翠绿 */ body[data-page="class"] { --subject: #059669; --subject-2: #047857; --subject-light: #d1fae5; --primary: #059669; --primary-light: #d1fae5; --primary-dark: #047857; background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%); } /* 学生信息 — 天蓝 */ body[data-page="students"] { --subject: #2563eb; --subject-2: #1d4ed8; --subject-light: #dbeafe; --primary: #2563eb; --primary-light: #dbeafe; --primary-dark: #1d4ed8; background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%); } /* 学生端 — 橙 */ body[data-page="student"] { --subject: #ea580c; --subject-2: #c2410c; --subject-light: #ffedd5; --primary: #ea580c; --primary-light: #ffedd5; --primary-dark: #c2410c; background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%); } /* 作业 — 蓝绿 */ body[data-page="homework"] { --subject: #0d9488; --subject-2: #0f766e; --subject-light: #ccfbf1; --primary: #0d9488; --primary-light: #ccfbf1; --primary-dark: #0f766e; background: linear-gradient(135deg, #f0fdfa 0%, #ccfbf1 100%); } /* 登录 / 鉴权 — 蓝 */ body[data-page="login"] { --subject: #2563eb; --subject-2: #1d4ed8; --subject-light: #dbeafe; --primary: #2563eb; --primary-light: #dbeafe; --primary-dark: #1d4ed8; background: linear-gradient(135deg, #eff6ff 0%, #bfdbfe 100%); } /* 管理后台 — 石板灰 */ body[data-page="admin"] { --subject: #475569; --subject-2: #334155; --subject-light: #f1f5f9; --primary: #475569; --primary-light: #f1f5f9; --primary-dark: #334155; background: linear-gradient(135deg, #f9fafb 0%, #e5e7eb 100%); } /* 答题卡生成器 — 黄绿 */ body[data-page="card"] { --subject: #4d7c0f; --subject-2: #365314; --subject-light: #ecfccb; --primary: #4d7c0f; --primary-light: #ecfccb; --primary-dark: #365314; background: linear-gradient(135deg, #f7fee7 0%, #ecfccb 100%); } /* 导入记录 — 赭黄 */ body[data-page="import"] { --subject: #a16207; --subject-2: #854d0e; --subject-light: #fef9c3; --primary: #a16207; --primary-light: #fef9c3; --primary-dark: #854d0e; background: linear-gradient(135deg, #fefce8 0%, #fef9c3 100%); } /* 家长设置 — 品红 */ body[data-page="parent"] { --subject: #a21caf; --subject-2: #86198f; --subject-light: #fae8ff; --primary: #a21caf; --primary-light: #fae8ff; --primary-dark: #86198f; background: linear-gradient(135deg, #fdf4ff 0%, #fae8ff 100%); } /* 上传 — 深青 */ body[data-page="upload"] { --subject: #0e7490; --subject-2: #155e75; --subject-light: #e0f2fe; --primary: #0e7490; --primary-light: #e0f2fe; --primary-dark: #155e75; background: linear-gradient(135deg, #ecfeff 0%, #e0f2fe 100%); } /* -------------------------------------------------------------------------- 导航条跟随页面换色：整体泛一点页面色调 + 底部 3px 实色彩条（覆盖 style.css 的纯白 .navbar，特异性更高） -------------------------------------------------------------------------- */ body[data-page] .navbar { background: var(--primary-light); background: color-mix(in srgb, var(--primary) 7%, #ffffff); border-bottom: 3px solid var(--primary); } /* 导航条 logo 圆角底色 + 激活态导航项在本页主题色下更鲜明 */ body[data-page] .logo-icon { background: var(--subject-light); color: var(--subject); } body[data-page] .nav-link.active { background: var(--subject-light); color: var(--subject); font-weight: 600; } body[data-page] .nav-link:hover { background: var(--subject-light); color: var(--subject); } /* 页头已使用 --primary-light 渐变 + --primary 左边框，覆盖 --primary 系列变量后自动跟随本页换色，无需额外改写。 */ /* 移动端：渐变背景与导航条彩条同样生效 */ @media (max-width: 768px) { body[data-page] { background-attachment: fixed; } }