2.0 KiB
2.0 KiB
.impeccable.md — 七虎AI 设计上下文
本文件为 impeccable 技能提供项目级设计上下文。完整规范见 DESIGN.md(单一事实源)与 design-system/MASTER.md。
Audience & Use Case
七虎 AI 是面向企业与开发者的 AI PaaS 平台:智能体编排、技能/市场、模型库、工作流、IM Bot(个人微信)。使用者是开发者与运营人员,需要高密度、可信、精密的控制台界面。
Brand & Tone
- 风格:温暖科技感 + 极简主义(Warm Tech Minimalism)。
- 唯一品牌色:靛蓝
#5B5FED(hover#4A4ECC,浅底#EEEDFF)。语义色仅表状态(成功#219B5E/ 警告#E8922C/ 错误#D9383A/ 信息#3B82F6)。 - 基调:专业、可信、有温度;留白与柔和阴影营造呼吸感;动效克制(150–300ms)。
Tech & Constraints
- 前端:React 18 + TypeScript + Vite 5,HashRouter,浅色主题。
- 设计 token 全在
frontend/src/styles/global.css的:root(颜色/间距/圆角/字体/阴影)。新增视觉必须先加 token,禁止散落 hex。 - 字体:Inter(文本)+ JetBrains Mono(代码/ID/参数)。
- 图标:Lucide,禁止 emoji 当图标。
- 布局:左侧 sidebar(240/折叠64)+ 顶 header(56)+ 主内容区;详情用右侧 drawer。
Build & Verify(交付铁律)
- 改完
frontend/src后必须在容器内npm run build。 - 校验新
dist确实含改动(grep 标记或构建日志),再请用户硬刷新验收。 - 每轮收工:
git commit + push到git.qihuyun.com,并docker commit同名镜像(qihuaiflow:with-deps)+ 备份上一版,确保容器重建不丢。
Quality Bar(impeccable 验收)
- 所有可点击元素有
cursor:pointer+ hover + 可见 focus 环。 - 对比度 ≥4.5:1;尊重
prefers-reduced-motion。 - 响应式:375 / 768 / 1024 / 1440;无横向滚动。
- 不引入第二品牌色、不用 emoji 图标、不用布局位移的 scale hover。