5a1e185b1a
phosphor console v1.1 设计系统(从现网 web/style.css 演化):tokens(colors/effects/ typography/fonts) + components(core/forms/surfaces .jsx) + ui_kits(console + console_mobile) + assets/icons(15 双色 SVG) + guidelines + CLAUDE/SKILL/readme。供 B1–B6 重构任务对照实现。 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
1 line
16 KiB
JSON
1 line
16 KiB
JSON
{"namespace":"MaestroDesignSystem_a6a290","components":[{"name":"Button","sourcePath":"components/core/Button.jsx"},{"name":"ComplexityBadge","sourcePath":"components/core/ComplexityBadge.jsx"},{"name":"CountBadge","sourcePath":"components/core/CountBadge.jsx"},{"name":"QuotaMeter","sourcePath":"components/core/QuotaMeter.jsx"},{"name":"SectionHead","sourcePath":"components/core/SectionHead.jsx"},{"name":"StatusChip","sourcePath":"components/core/StatusChip.jsx"},{"name":"ComplexitySeg","sourcePath":"components/forms/ComplexitySeg.jsx"},{"name":"Input","sourcePath":"components/forms/Input.jsx"},{"name":"Select","sourcePath":"components/forms/Select.jsx"},{"name":"Textarea","sourcePath":"components/forms/Textarea.jsx"},{"name":"EventItem","sourcePath":"components/surfaces/EventItem.jsx"},{"name":"GateCard","sourcePath":"components/surfaces/GateCard.jsx"},{"name":"GateStripe","sourcePath":"components/surfaces/GateCard.jsx"},{"name":"Panel","sourcePath":"components/surfaces/Panel.jsx"},{"name":"Timeline","sourcePath":"components/surfaces/Timeline.jsx"},{"name":"Toast","sourcePath":"components/surfaces/Toast.jsx"}],"startingPoints":[{"name":"Button","path":"components/core/Button.jsx","previewPath":"components/core/core.card.html","kind":"component","section":"Components","subtitle":"五种变体的等宽直角按钮","viewport":"700x180"},{"name":"console","path":"ui_kits/console/index.html","previewPath":"ui_kits/console/index.html","kind":"screen","section":"Screens","subtitle":"Maestro Web 调度台整屏","viewport":"1440x900"}],"cards":[{"path":"guidelines/brand-glyphs.card.html","group":"Brand","viewport":"700x280","subtitle":"双色调图标集:基础笔画中性灰 + 语义元素信号色 · 24×24 · 2px 圆头描边 · assets/icons/","name":"图标 · Icons"},{"path":"guidelines/brand-logo.card.html","group":"Brand","viewport":"700x230","subtitle":"像素章鱼图案:一脑多臂 · 横排锁定 + 独立方形徽标","name":"Logo"},{"path":"guidelines/brand-motion.card.html","group":"Brand","viewport":"700x150","subtitle":"动效三件套:blink(光标)· pulse(等待/执行)· rise(入场)","name":"动效 · Motion"},{"path":"guidelines/brand-texture.card.html","group":"Brand","viewport":"700x160","subtitle":"氛围层:1px 扫描线 + 暗角;琥珀斜纹警示条","name":"质感 · Texture"},{"path":"guidelines/colors-ink.card.html","group":"Colors","viewport":"700x130","subtitle":"文字三档:ink / muted / faint","name":"文字色 · Ink"},{"path":"guidelines/colors-light.card.html","group":"Colors","viewport":"700x180","subtitle":"Light 主题:<html data-theme="light"> 激活,信号色加深保对比","name":"Light 主题"},{"path":"guidelines/colors-signals.card.html","group":"Colors","viewport":"700x300","subtitle":"五个磷光信号色 + 状态机分组全展示(审批闸已由琥珀改为磷光紫)","name":"信号色 · Signals"},{"path":"guidelines/colors-surfaces.card.html","group":"Colors","viewport":"700x150","subtitle":"碳绿基底四层抬升 + 两档描边","name":"基底 · Surfaces"},{"path":"guidelines/colors-tints.card.html","group":"Colors","viewport":"700x140","subtitle":"信号色 7–8% 透明底 + dim 边框的 chip 配方","name":"信号底 · Tints"},{"path":"components/core/core.card.html","group":"Components","viewport":"700x280","subtitle":"Button 五变体 · StatusChip · ComplexityBadge · CountBadge · QuotaMeter · SectionHead","name":"Core · 按钮与徽章"},{"path":"components/forms/forms.card.html","group":"Components","viewport":"700x240","subtitle":"Input · Select · Textarea(danger) · ComplexitySeg(含智能段)","name":"Forms · 表单控件"},{"path":"components/surfaces/surfaces.card.html","group":"Components","viewport":"700x400","subtitle":"GateCard 审批闸 · Toast · EventItem 事件流 · Timeline 时间线 · Panel","name":"Surfaces · 面板与反馈"},{"path":"ui_kits/console_mobile/index.html","group":"Console","viewport":"390x760","subtitle":"单栏 + 底部 Tab(任务/审批/事件/项目)· 触控目标 ≥44px · 可点击","name":"移动版调度台"},{"path":"ui_kits/console/index.html","group":"Console","viewport":"1440x900","subtitle":"三栏看板整屏复刻:项目 · 审批闸+任务树 · 事件流(可点击)","name":"Web 调度台"},{"path":"guidelines/spacing-borders.card.html","group":"Spacing","viewport":"700x150","subtitle":"边框语言:细线两档 · 虚线空态 · 2px 左侧强调边","name":"边框 · Borders"},{"path":"guidelines/spacing-glow.card.html","group":"Spacing","viewport":"700x150","subtitle":"辉光替代阴影;黑色外阴影只给浮层","name":"辉光 · Glow"},{"path":"guidelines/spacing-radius.card.html","group":"Spacing","viewport":"700x150","subtitle":"圆角体系:控件 3–4px · 面板 6px · 浮层 10px · 圆形只属于状态点","name":"圆角 · Radius"},{"path":"guidelines/spacing-scale.card.html","group":"Spacing","viewport":"700x160","subtitle":"间距阶 4–22px 与控件内边距","name":"间距 · Scale"},{"path":"guidelines/type-family.card.html","group":"Type","viewport":"700x170","subtitle":"单字族:IBM Plex Mono + Noto Sans SC 等宽中文混排","name":"字族 · Mono"},{"path":"guidelines/type-scale.card.html","group":"Type","viewport":"700x200","subtitle":"字号阶 10–40px,正文基准 13px","name":"字号阶 · Scale"},{"path":"guidelines/type-tracking.card.html","group":"Type","viewport":"700x170","subtitle":"层级靠字距:.04em 标题 → .35em logo 副标","name":"字距 · Tracking"}],"templates":[],"globalCssPaths":["tokens/fonts.css","tokens/colors.css","tokens/typography.css","tokens/effects.css","styles.css"],"tokens":[{"name":"--bg","value":"#0a0d0b","kind":"color","definedIn":"tokens/colors.css"},{"name":"--bg-deep","value":"#070908","kind":"color","definedIn":"tokens/colors.css"},{"name":"--panel","value":"#10140f","kind":"color","definedIn":"tokens/colors.css"},{"name":"--panel-2","value":"#151b14","kind":"color","definedIn":"tokens/colors.css"},{"name":"--line","value":"#232d23","kind":"color","definedIn":"tokens/colors.css"},{"name":"--line-soft","value":"#1a221a","kind":"color","definedIn":"tokens/colors.css"},{"name":"--ink","value":"#d8e4d4","kind":"color","definedIn":"tokens/colors.css"},{"name":"--muted","value":"#76876f","kind":"color","definedIn":"tokens/colors.css"},{"name":"--faint","value":"#4a5747","kind":"color","definedIn":"tokens/colors.css"},{"name":"--green","value":"#5fdd7d","kind":"color","definedIn":"tokens/colors.css"},{"name":"--green-dim","value":"#2e6b3d","kind":"color","definedIn":"tokens/colors.css"},{"name":"--violet","value":"#b88ef5","kind":"color","definedIn":"tokens/colors.css"},{"name":"--violet-dim","value":"#503070","kind":"color","definedIn":"tokens/colors.css"},{"name":"--amber","value":"#f0b429","kind":"color","definedIn":"tokens/colors.css"},{"name":"--amber-dim","value":"#6b5414","kind":"color","definedIn":"tokens/colors.css"},{"name":"--red","value":"#ff5d5d","kind":"color","definedIn":"tokens/colors.css"},{"name":"--red-dim","value":"#6b2424","kind":"color","definedIn":"tokens/colors.css"},{"name":"--cyan","value":"#59c8d8","kind":"color","definedIn":"tokens/colors.css"},{"name":"--cyan-dim","value":"#1e4e57","kind":"color","definedIn":"tokens/colors.css"},{"name":"--glow-green","value":"0 0 12px rgba(95, 221, 125, .45)","kind":"shadow","definedIn":"tokens/colors.css"},{"name":"--glow-violet","value":"0 0 14px rgba(184, 142, 245, .4)","kind":"shadow","definedIn":"tokens/colors.css"},{"name":"--glow-cyan","value":"0 0 18px rgba(89, 200, 216, .5)","kind":"shadow","definedIn":"tokens/colors.css"},{"name":"--glow-red","value":"0 0 14px rgba(255, 93, 93, .3)","kind":"shadow","definedIn":"tokens/colors.css"},{"name":"--surface-page","value":"var(--bg)","kind":"color","definedIn":"tokens/colors.css"},{"name":"--surface-rail","value":"var(--bg-deep)","kind":"color","definedIn":"tokens/colors.css"},{"name":"--surface-card","value":"var(--panel)","kind":"color","definedIn":"tokens/colors.css"},{"name":"--surface-raised","value":"var(--panel-2)","kind":"color","definedIn":"tokens/colors.css"},{"name":"--text-body","value":"var(--ink)","kind":"font","definedIn":"tokens/colors.css"},{"name":"--text-secondary","value":"var(--muted)","kind":"font","definedIn":"tokens/colors.css"},{"name":"--text-disabled","value":"var(--faint)","kind":"font","definedIn":"tokens/colors.css"},{"name":"--border-default","value":"var(--line)","kind":"color","definedIn":"tokens/colors.css"},{"name":"--border-soft","value":"var(--line-soft)","kind":"color","definedIn":"tokens/colors.css"},{"name":"--accent","value":"var(--green)","kind":"color","definedIn":"tokens/colors.css"},{"name":"--accent-dim","value":"var(--green-dim)","kind":"color","definedIn":"tokens/colors.css"},{"name":"--status-go","value":"var(--green)","kind":"color","definedIn":"tokens/colors.css"},{"name":"--status-gate","value":"var(--violet)","kind":"color","definedIn":"tokens/colors.css"},{"name":"--status-bad","value":"var(--red)","kind":"color","definedIn":"tokens/colors.css"},{"name":"--status-run","value":"var(--cyan)","kind":"color","definedIn":"tokens/colors.css"},{"name":"--bg","value":"#f3f6f1","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--bg-deep","value":"#e9eee6","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--panel","value":"#fcfdfb","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--panel-2","value":"#e4ebe1","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--line","value":"#c9d4c6","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--line-soft","value":"#dbe3d8","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--ink","value":"#1d251b","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--muted","value":"#5c6b57","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--faint","value":"#92a08c","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--green","value":"#1b8f46","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--green-dim","value":"#b5e2c3","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--violet","value":"#7747d1","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--violet-dim","value":"#dcccf6","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--amber","value":"#946d06","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--amber-dim","value":"#ecd9a0","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--red","value":"#cd3434","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--red-dim","value":"#f2baba","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--cyan","value":"#0b7488","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--cyan-dim","value":"#b2dfe7","kind":"color","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--glow-green","value":"0 0 10px rgba(27, 143, 70, .25)","kind":"shadow","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--glow-violet","value":"0 0 10px rgba(119, 71, 209, .22)","kind":"shadow","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--glow-cyan","value":"0 0 12px rgba(11, 116, 136, .25)","kind":"shadow","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--glow-red","value":"0 0 10px rgba(205, 52, 52, .2)","kind":"shadow","definedIn":"tokens/colors.css","scope":"[data-theme=\"light\"]"},{"name":"--mono","value":"'IBM Plex Mono', 'Noto Sans SC', ui-monospace, monospace","kind":"font","definedIn":"tokens/typography.css","annotation":"font"},{"name":"--font-body","value":"var(--mono)","kind":"font","definedIn":"tokens/typography.css"},{"name":"--text-2xs","value":"10px","kind":"font","definedIn":"tokens/typography.css"},{"name":"--text-xs","value":"11px","kind":"font","definedIn":"tokens/typography.css"},{"name":"--text-sm","value":"12px","kind":"font","definedIn":"tokens/typography.css"},{"name":"--text-md","value":"13px","kind":"font","definedIn":"tokens/typography.css"},{"name":"--text-lg","value":"15px","kind":"font","definedIn":"tokens/typography.css"},{"name":"--text-xl","value":"19px","kind":"font","definedIn":"tokens/typography.css"},{"name":"--text-2xl","value":"20px","kind":"font","definedIn":"tokens/typography.css"},{"name":"--text-num","value":"40px","kind":"font","definedIn":"tokens/typography.css"},{"name":"--leading-body","value":"1.55","kind":"font","definedIn":"tokens/typography.css"},{"name":"--leading-doc","value":"1.7","kind":"font","definedIn":"tokens/typography.css"},{"name":"--tracking-tight","value":".04em","kind":"font","definedIn":"tokens/typography.css"},{"name":"--tracking-label","value":".08em","kind":"font","definedIn":"tokens/typography.css"},{"name":"--tracking-badge","value":".12em","kind":"font","definedIn":"tokens/typography.css"},{"name":"--tracking-head","value":".22em","kind":"font","definedIn":"tokens/typography.css"},{"name":"--tracking-logo","value":".28em","kind":"font","definedIn":"tokens/typography.css"},{"name":"--tracking-widest","value":".35em","kind":"font","definedIn":"tokens/typography.css"},{"name":"--radius-xs","value":"3px","kind":"radius","definedIn":"tokens/effects.css"},{"name":"--radius-sm","value":"4px","kind":"radius","definedIn":"tokens/effects.css"},{"name":"--radius-md","value":"6px","kind":"radius","definedIn":"tokens/effects.css"},{"name":"--radius-lg","value":"10px","kind":"radius","definedIn":"tokens/effects.css"},{"name":"--radius-dot","value":"50%","kind":"radius","definedIn":"tokens/effects.css"},{"name":"--border-w","value":"1px","kind":"spacing","definedIn":"tokens/effects.css"},{"name":"--border-accent-w","value":"2px","kind":"spacing","definedIn":"tokens/effects.css"},{"name":"--space-1","value":"4px","kind":"spacing","definedIn":"tokens/effects.css"},{"name":"--space-2","value":"6px","kind":"spacing","definedIn":"tokens/effects.css"},{"name":"--space-3","value":"8px","kind":"spacing","definedIn":"tokens/effects.css"},{"name":"--space-4","value":"10px","kind":"spacing","definedIn":"tokens/effects.css"},{"name":"--space-5","value":"12px","kind":"spacing","definedIn":"tokens/effects.css"},{"name":"--space-6","value":"14px","kind":"spacing","definedIn":"tokens/effects.css"},{"name":"--space-7","value":"16px","kind":"spacing","definedIn":"tokens/effects.css"},{"name":"--space-8","value":"20px","kind":"spacing","definedIn":"tokens/effects.css"},{"name":"--space-9","value":"22px","kind":"spacing","definedIn":"tokens/effects.css"},{"name":"--pad-btn","value":"6px 14px","kind":"spacing","definedIn":"tokens/effects.css"},{"name":"--pad-btn-xs","value":"2px 8px","kind":"spacing","definedIn":"tokens/effects.css"},{"name":"--pad-input","value":"7px 10px","kind":"spacing","definedIn":"tokens/effects.css"},{"name":"--pad-chip","value":"1px 8px","kind":"spacing","definedIn":"tokens/effects.css"},{"name":"--pad-card","value":"12px 14px","kind":"spacing","definedIn":"tokens/effects.css"},{"name":"--shadow-pop","value":"0 10px 30px rgba(0, 0, 0, .65)","kind":"shadow","definedIn":"tokens/effects.css"},{"name":"--shadow-modal","value":"0 18px 60px rgba(0, 0, 0, .6)","kind":"shadow","definedIn":"tokens/effects.css"},{"name":"--shadow-toast","value":"0 8px 30px rgba(0, 0, 0, .55)","kind":"shadow","definedIn":"tokens/effects.css"},{"name":"--ease-fast","value":".12s","kind":"other","definedIn":"tokens/effects.css","annotation":"other"},{"name":"--ease-base","value":".2s ease","kind":"other","definedIn":"tokens/effects.css","annotation":"other"}],"themes":[{"selector":"[data-theme=\"light\"]","label":"Light"}],"fonts":[],"brandFonts":[{"family":"IBM Plex Mono","status":"ok","tokens":["--mono"],"path":"tokens/typography.css"}],"source":"spa"} |