- 新增多轮 GraphRAG 检索功能,支持流式进度输出(SSE) - 新增用户管理界面,可查看所有用户图谱统计并快速导航 - 新增多 Agent 任务拆解与执行服务,支持复杂任务协作处理 - 改进 embedding 和 rerank 服务的容错机制,支持备用模型和端点 - 更新前端样式遵循 Acmetone 设计规范,优化视觉一致性 - 新增流式分析接口,支持并行处理和专家评审选项
3.5 KiB
3.5 KiB
name, description
| name | description |
|---|---|
| acmetone-design-specs | Acmetone项目专属设计规范(颜色、字体、特色UI组件)。在创建新页面、组件或修改样式时务必调用此技能,以保证UI风格一致和最小化改动。 |
Acmetone 设计规范 (Design Specifications)
在为 Acmetone 项目开发新功能、新增页面或修改 UI 组件时,请务必遵循以下设计规范,确保“基于最小改动”并“尽量在原基础上复用”。
1. 颜色规范 (Color Palette)
- 基础背景:主要为纯白 (
#ffffff),特殊页面(如 AirplanMode)使用深灰 (#333333)。 - 文本颜色:
- 主文本:黑色 (
#000000) 或#111111 - 次要/辅助文本:各级灰色(
#555555,#666666,#888888)
- 主文本:黑色 (
- 边框与装饰线:浅灰色(
#cccccc,#dddddd)
2. 字体与排版 (Typography)
- 基础字体:系统默认无衬线字体栈
var(--font-family)(-apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC" ...)。 - 特效/高亮字体:
DotGothic16(点阵字体),常用于超大标题或特殊高亮,自带复古科技感。 - 典型字号层级:
- 超大标题 (Hero Title):
72px - 模块标题 (Section Title):
48px/36px - 正文描述 (Body Text):
16px/14px - 小标签/附加信息 (Labels):
13px/12px(配合letter-spacing: 1px或1.5px)
- 超大标题 (Hero Title):
3. 特色 UI 元素 (Signature UI Elements)
- 科技感边角 (Tech Brackets / Corner Crosses):
- 项目显著特征。在按钮 (
.btn-container)、图标包裹盒 (.ms-icon-box) 边缘使用四个直角边框进行装饰。 - DOM 结构参考:包含四个
<span class="corner top-left"></span>、<span class="corner top-right"></span>等元素。 - 交互:Hover 时伴随边角向外扩散的动效 (
transform: translate(...))。
- 项目显著特征。在按钮 (
- 按钮体系:
light模式:透明背景 + 黑字 (.tech-btn.light)dark模式:黑底白字 + 柔和底阴影 (box-shadow: 0 15px 35px rgba(0,0,0,0.15)) (.tech-btn.dark)
- 高亮十字星 (Highlight Crosses):使用
.highlight配合伪元素或.cross-tl,.cross-br实现角落的十字线装饰。
4. 布局与视觉动效 (Layout & Effects)
- 环境光效 (Ambient Glow):页面顶部常驻半透明的径向渐变光效 (
.ambient-glow)。 - 层级管理 (Z-Index):
- 底层粒子画布
#particleCanvas:z-index: 1,pointer-events: none。 - 顶层导航:
z-index: 100。
- 底层粒子画布
- 微交互动效:
- 图标上下缓动悬浮 (
@keyframes floatIcon)。 - 按钮内箭头的水平位移动效 (
.btn-container:hover .btn-arrow { transform: translateX(4px); })。
- 图标上下缓动悬浮 (
5. 开发原则
- 复用优先:优先使用
style.css中已有的类名(如.btn-container,.ms-icon-box,.flex-center),避免重复写样式。 - Tailwind 结合:项目已配置 Tailwind CSS 4.x,基础布局可使用 Tailwind 类名,但特色组件(如带边角的按钮)请复用自定义 CSS 类以保持一致性。
6. 核心资源参考 (Core Resources)
为了确保设计规范的严格执行,本 Skill 附带了项目核心的样式与配置资源。在需要深入了解具体样式实现或 CSS 变量时,请参考以下文件:
- 全局样式与特色组件:
resources/style.css(包含了所有自定义的 UI 组件如.corner,.btn-container等的具体实现) - Tailwind 配置:
resources/tailwind.config.js - 视觉展示网站:
website/index.html(包含完整设计系统视觉指南与交互演示)