jacobxu666andClaude Opus 4.8
6ed4d5a61e
- 全站按 Corporate Trust 设计规范重做:靛蓝/紫罗兰渐变、Plus Jakarta Sans 自托管字体、带色阴影、卡片悬浮、氛围光斑 - 打卡任务增加科目分类(语文/数学/英语/运动/其他),孩子端按科目分组 - 英语语法自学模块:线性解锁课程 + 课后/周/月测验引擎,测验达标 自动联动当日英语打卡;家长概览显示语法进度 - 课程内容:A1→B1 完整大纲,9 周 54 课 + 9 周测 + 2 月测,讲解/例句/ 练习/测验均原创,仅参考两份语法书的主题编排 Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
90 lines
2.8 KiB
CSS
90 lines
2.8 KiB
CSS
@import "tailwindcss";
|
|
@import "@fontsource-variable/plus-jakarta-sans";
|
|
|
|
@custom-variant dark (&:is(.dark *));
|
|
|
|
@theme inline {
|
|
--color-background: var(--background);
|
|
--color-foreground: var(--foreground);
|
|
--color-card: var(--card);
|
|
--color-card-foreground: var(--card-foreground);
|
|
--color-popover: var(--popover);
|
|
--color-popover-foreground: var(--popover-foreground);
|
|
--color-primary: var(--primary);
|
|
--color-primary-foreground: var(--primary-foreground);
|
|
--color-secondary: var(--secondary);
|
|
--color-secondary-foreground: var(--secondary-foreground);
|
|
--color-muted: var(--muted);
|
|
--color-muted-foreground: var(--muted-foreground);
|
|
--color-accent: var(--accent);
|
|
--color-accent-foreground: var(--accent-foreground);
|
|
--color-destructive: var(--destructive);
|
|
--color-border: var(--border);
|
|
--color-input: var(--input);
|
|
--color-ring: var(--ring);
|
|
--radius-sm: calc(var(--radius) - 4px);
|
|
--radius-md: calc(var(--radius) - 2px);
|
|
--radius-lg: var(--radius);
|
|
--radius-xl: calc(var(--radius) + 4px);
|
|
|
|
/* 品牌字体:拉丁用 Plus Jakarta Sans,中文回落系统字体 */
|
|
--font-sans: "Plus Jakarta Sans Variable", "PingFang SC", "Hiragino Sans GB",
|
|
"Microsoft YaHei", system-ui, sans-serif;
|
|
|
|
/* 带色阴影(企业信任风的核心视觉签名) */
|
|
--shadow-soft: 0 4px 20px -2px rgb(79 70 229 / 0.1);
|
|
--shadow-lift: 0 10px 25px -5px rgb(79 70 229 / 0.15),
|
|
0 8px 10px -6px rgb(79 70 229 / 0.1);
|
|
--shadow-btn: 0 4px 14px 0 rgb(79 70 229 / 0.3);
|
|
}
|
|
|
|
/* Corporate Trust 色板:靛蓝主色 + 紫罗兰辅色 + 冷灰中性色 */
|
|
:root {
|
|
--radius: 0.75rem;
|
|
--background: #f8fafc; /* slate-50 */
|
|
--foreground: #0f172a; /* slate-900 */
|
|
--card: #ffffff;
|
|
--card-foreground: #0f172a;
|
|
--popover: #ffffff;
|
|
--popover-foreground: #0f172a;
|
|
--primary: #4f46e5; /* indigo-600 */
|
|
--primary-foreground: #ffffff;
|
|
--secondary: #f1f5f9; /* slate-100 */
|
|
--secondary-foreground: #334155; /* slate-700 */
|
|
--muted: #f1f5f9;
|
|
--muted-foreground: #64748b; /* slate-500 */
|
|
--accent: #eef2ff; /* indigo-50 */
|
|
--accent-foreground: #4f46e5;
|
|
--destructive: #ef4444;
|
|
--border: #e2e8f0; /* slate-200 */
|
|
--input: #e2e8f0;
|
|
--ring: #6366f1; /* indigo-500 */
|
|
--violet: #7c3aed; /* violet-600,渐变辅色 */
|
|
--emerald: #10b981; /* 成功色 */
|
|
}
|
|
|
|
@layer base {
|
|
* {
|
|
@apply border-border outline-ring/50;
|
|
}
|
|
body {
|
|
@apply bg-background text-foreground font-sans antialiased;
|
|
}
|
|
}
|
|
|
|
/* 渐变文字:靛蓝 → 紫罗兰,用于重点标题 */
|
|
@utility text-gradient {
|
|
background-image: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
|
|
-webkit-background-clip: text;
|
|
background-clip: text;
|
|
color: transparent;
|
|
}
|
|
|
|
/* 背景氛围光斑:大号模糊渐变圆,营造纵深 */
|
|
@utility bg-blob {
|
|
position: absolute;
|
|
border-radius: 9999px;
|
|
filter: blur(64px);
|
|
pointer-events: none;
|
|
}
|