M0-M4: 推倒重来基线(基建+用户/密钥/核心代理+前端+管理后台+三协议互转)
- 后端 Go+Gin+GORM: 配置(OT_ env)/SQLite/Postgres 双驱动、用户体系(argon2id+JWT access/refresh)、 API Key(sk- 48位, 仅存 SHA-256 哈希) - 代理网关: /v1/chat/completions、/v1/responses、/v1/messages、/v1/models;错误按客户端协议返回 - 三协议互转(convert 包): Chat↔Messages↔Responses 请求/响应 + 流式 SSE 逐事件转换(直通优先) - 用量计费: 异步批量记账、余额扣减、balance_logs、usage_daily 日聚合 - 管理 API: 用户/渠道 CRUD+测试+模型导入/模型定价+绑定/统计/系统配置 - 前端 Vue3+TS+Tailwind(taste-skill 设计 tokens): Landing/登录注册/控制台/管理后台, 自建组件+Phosphor 图标+自建 SVG 趋势图, 已过 web-design-guidelines 复查 - mock 上游: OpenAI+Anthropic 双协议模拟(含流式) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
+43
-99
@@ -1,122 +1,66 @@
|
||||
@import "tailwindcss";
|
||||
@import "@fontsource/outfit/400.css";
|
||||
@import "@fontsource/outfit/500.css";
|
||||
@import "@fontsource/outfit/600.css";
|
||||
@import "@fontsource/outfit/700.css";
|
||||
@import "@fontsource/jetbrains-mono/400.css";
|
||||
@import "@fontsource/jetbrains-mono/500.css";
|
||||
@import "@fontsource/jetbrains-mono/600.css";
|
||||
@import 'tailwindcss';
|
||||
@import '@fontsource-variable/geist';
|
||||
@import '@fontsource-variable/geist-mono';
|
||||
|
||||
/* ============================================================
|
||||
openteam 设计 tokens(taste-skill 产出)
|
||||
方向:深色优先的开发者控制台 / 信号系统语言
|
||||
色板:石墨墨底 + 暖白文本 + 单一信号铜色强调(信号灯)
|
||||
数据一律 mono(JetBrains Mono),UI 用 Outfit
|
||||
============================================================ */
|
||||
/* ------------------------------------------------------------------ */
|
||||
/* 设计 tokens(taste-skill 产出) */
|
||||
/* 深色优先 · 单一强调色 emerald · 圆角体系:卡片 8 / 控件 6 / 徽章 pill */
|
||||
/* 密度 7:mono 数字、紧凑表格、细线分隔 */
|
||||
/* ------------------------------------------------------------------ */
|
||||
|
||||
@theme {
|
||||
/* 墨色层(背景阶梯) */
|
||||
--color-ink-950: #0c0d0f;
|
||||
--color-ink-900: #121417;
|
||||
--color-ink-850: #16191d;
|
||||
--color-ink-800: #1c2025;
|
||||
--color-ink-700: #282d34;
|
||||
--color-ink-600: #363c45;
|
||||
--font-sans: 'Geist Variable', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
|
||||
--font-mono: 'Geist Mono Variable', ui-monospace, SFMono-Regular, Menlo, monospace;
|
||||
|
||||
/* 纸色层(文本) */
|
||||
--color-paper-100: #eae8e3;
|
||||
--color-paper-300: #c8c5bd;
|
||||
--color-paper-500: #8b909a;
|
||||
--color-paper-600: #63686f;
|
||||
/* 强调色(单一一处定义,全局一致) */
|
||||
--color-accent: oklch(0.72 0.17 152);
|
||||
--color-accent-strong: oklch(0.64 0.19 152);
|
||||
--color-accent-soft: oklch(0.95 0.05 152);
|
||||
|
||||
/* 信号铜色(唯一强调,信号灯意象) */
|
||||
--color-signal-200: #f7d9a8;
|
||||
--color-signal-300: #f0be6d;
|
||||
--color-signal-400: #e5a13c;
|
||||
--color-signal-500: #c9842a;
|
||||
--color-signal-600: #a56a1f;
|
||||
|
||||
/* 语义色 */
|
||||
--color-mint-300: #7fd0ac;
|
||||
--color-mint-400: #4cb58a;
|
||||
--color-mint-500: #33946f;
|
||||
--color-ember-300: #ec8a80;
|
||||
--color-ember-400: #d9685c;
|
||||
--color-ember-500: #b34c42;
|
||||
--color-sky-300: #93bce4;
|
||||
--color-sky-400: #6e9fd8;
|
||||
|
||||
--font-sans: "Outfit", ui-sans-serif, system-ui, sans-serif;
|
||||
--font-mono: "JetBrains Mono", ui-monospace, "SF Mono", monospace;
|
||||
|
||||
/* 圆角:全局统一 6px(工具类,克制) */
|
||||
--radius-sm: 4px;
|
||||
--radius-md: 6px;
|
||||
--radius-lg: 10px;
|
||||
}
|
||||
|
||||
/* 亮色主题(保留:data-theme="light" 时切换,默认深色优先) */
|
||||
[data-theme="light"] {
|
||||
--color-ink-950: #f4f3f0;
|
||||
--color-ink-900: #ffffff;
|
||||
--color-ink-850: #faf9f6;
|
||||
--color-ink-800: #f0efeb;
|
||||
--color-ink-700: #e2e0da;
|
||||
--color-ink-600: #cfccc4;
|
||||
--color-paper-100: #1d2024;
|
||||
--color-paper-300: #3a3f46;
|
||||
--color-paper-500: #5f6670;
|
||||
--color-paper-600: #8a9099;
|
||||
--color-signal-400: #b3741c;
|
||||
--color-signal-500: #9a6116;
|
||||
--color-mint-400: #1f8a61;
|
||||
--color-ember-400: #c24b41;
|
||||
--color-sky-400: #3f78b8;
|
||||
/* 状态色(语义,克制使用) */
|
||||
--color-ok: oklch(0.72 0.17 152);
|
||||
--color-warn: oklch(0.80 0.15 75);
|
||||
--color-err: oklch(0.63 0.21 25);
|
||||
}
|
||||
|
||||
html {
|
||||
color-scheme: dark;
|
||||
}
|
||||
|
||||
[data-theme="light"] {
|
||||
color-scheme: light;
|
||||
}
|
||||
|
||||
body {
|
||||
@apply bg-ink-950 text-paper-100 font-sans antialiased;
|
||||
font-feature-settings: "ss01" on, "cv05" on;
|
||||
background-color: #09090b;
|
||||
color: #f4f4f5;
|
||||
font-family: var(--font-sans);
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
/* 数字统一用 tabular 对齐(数据密集场景) */
|
||||
.num {
|
||||
font-family: var(--font-mono);
|
||||
font-variant-numeric: tabular-nums;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
|
||||
/* 聚焦可见性:键盘可达性 */
|
||||
/* 全站统一键盘焦点可见性 */
|
||||
:focus-visible {
|
||||
outline: 2px solid var(--color-signal-400);
|
||||
outline: 2px solid var(--color-accent);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
/* 滚动条克制化 */
|
||||
::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: var(--color-ink-700);
|
||||
border-radius: 6px;
|
||||
border: 2px solid var(--color-ink-950);
|
||||
}
|
||||
::-webkit-scrollbar-track {
|
||||
background: transparent;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
*, *::before, *::after {
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
animation-duration: 0.01ms !important;
|
||||
transition-duration: 0.01ms !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* 通用组件视觉基元 */
|
||||
@layer components {
|
||||
.card {
|
||||
@apply rounded-lg border border-zinc-800 bg-zinc-900/60;
|
||||
}
|
||||
|
||||
.mono-num {
|
||||
@apply font-mono tabular-nums;
|
||||
}
|
||||
|
||||
.table-row {
|
||||
@apply border-b border-zinc-800/70 last:border-0 hover:bg-zinc-800/30;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user