重构技能编辑页面为四层结构:技能概览卡片(两行布局)→ 详细信息卡片 → 操作按钮区 → 版本管理 主要改进: - 技能概览卡片:左侧80x80图标,右侧两行结构(技能名称 + 关键指标) - 关键指标图标化:👥 订阅数、📦 当前版本、⭐ 评分 - 详细信息卡片:网格布局展示状态、分类、标签、技能描述、版本说明 - 操作按钮区:独立区域,视觉层次更清晰 - 响应式设计:移动端自适应布局
16 lines
1.4 KiB
YAML
16 lines
1.4 KiB
YAML
schema: spec-driven
|
||
|
||
context: |
|
||
- 交流、文档、注释、提交信息使用中文,代码命名使用英文
|
||
- 纯前端展示原型项目(非功能原型),无后端交互,供内部开发人员参考UI界面使用,目标在于展示页面布局、样式和组件能力
|
||
- 允许轻量级交互展示(如表单验证、弹框),状态展示策略:不重叠的状态通过静态数据驱动展示,重叠/覆盖类状态(弹框、下拉、抽屉等)允许简单交互切换
|
||
- 示例数据应精心设计,展示不同的页面元素状态
|
||
- 不引入UI库,使用当前SCSS样式方案
|
||
- 使用pnpm作为包管理器,javascript作为开发语言,不引入typescript或eslint
|
||
- 不构建测试,使用pnpm build验证打包即可,AI禁止运行pnpm dev(会挂起流程)
|
||
- 不做性能优化,保持vite-plugin-singlefile单文件打包
|
||
- 不做安全防御性编程,eval/dangerouslySetInnerHTML等按需使用
|
||
- README.md是项目的开发文档,记录代码结构和关键开发模式,优先读取获取上下文
|
||
- 涉及页面/路由/组件/功能模块变更或技术栈调整时,同步更新README.md
|
||
- Git提交: 仅中文; 格式为"类型: 简短描述",类型可选: feat(新功能)/fix(修复)/refactor(重构)/docs(文档)/style(格式)/test(测试)/chore(构建/工具); 多行描述空行后加详细说明; 禁创建git操作task
|