Initial commit: Clean DSS implementation
Migrated from design-system-swarm with fresh git history.
Old project history preserved in /home/overbits/apps/design-system-swarm
Core components:
- MCP Server (Python FastAPI with mcp 1.23.1)
- Claude Plugin (agents, commands, skills, strategies, hooks, core)
- DSS Backend (dss-mvp1 - token translation, Figma sync)
- Admin UI (Node.js/React)
- Server (Node.js/Express)
- Storybook integration (dss-mvp1/.storybook)
Self-contained configuration:
- All paths relative or use DSS_BASE_PATH=/home/overbits/dss
- PYTHONPATH configured for dss-mvp1 and dss-claude-plugin
- .env file with all configuration
- Claude plugin uses ${CLAUDE_PLUGIN_ROOT} for portability
Migration completed: $(date)
🤖 Clean migration with full functionality preserved
This commit is contained in:
Digital Production Factory
242
admin-ui/design-tokens.json
Normal file
242
admin-ui/design-tokens.json
Normal file
@@ -0,0 +1,242 @@
|
||||
{
|
||||
"$schema": "https://design-tokens.github.io/community-group/format/",
|
||||
"$version": "1.0.0",
|
||||
"design-system": {
|
||||
"name": "DSS Admin UI",
|
||||
"version": "1.0.0",
|
||||
"description": "Design System Swarm - Admin UI Design Tokens"
|
||||
},
|
||||
"color": {
|
||||
"primary": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(220, 14%, 10%)",
|
||||
"$description": "Primary brand color",
|
||||
"h": { "$type": "number", "$value": 220 },
|
||||
"s": { "$type": "number", "$value": "14%" },
|
||||
"l": { "$type": "number", "$value": "10%" },
|
||||
"foreground": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(0, 0%, 100%)"
|
||||
}
|
||||
},
|
||||
"secondary": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(220, 9%, 46%)",
|
||||
"h": { "$type": "number", "$value": 220 },
|
||||
"s": { "$type": "number", "$value": "9%" },
|
||||
"l": { "$type": "number", "$value": "46%" },
|
||||
"foreground": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(0, 0%, 100%)"
|
||||
}
|
||||
},
|
||||
"accent": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(220, 9%, 96%)",
|
||||
"h": { "$type": "number", "$value": 220 },
|
||||
"s": { "$type": "number", "$value": "9%" },
|
||||
"l": { "$type": "number", "$value": "96%" },
|
||||
"foreground": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(220, 14%, 10%)"
|
||||
}
|
||||
},
|
||||
"background": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(0, 0%, 100%)"
|
||||
},
|
||||
"foreground": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(220, 14%, 10%)"
|
||||
},
|
||||
"surface": {
|
||||
"0": { "$type": "color", "$value": "hsl(0, 0%, 100%)" },
|
||||
"1": { "$type": "color", "$value": "hsl(220, 14%, 98%)" },
|
||||
"2": { "$type": "color", "$value": "hsl(220, 9%, 96%)" },
|
||||
"3": { "$type": "color", "$value": "hsl(220, 9%, 94%)" }
|
||||
},
|
||||
"muted": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(220, 9%, 96%)",
|
||||
"foreground": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(220, 9%, 46%)"
|
||||
}
|
||||
},
|
||||
"border": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(220, 9%, 89%)",
|
||||
"strong": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(220, 9%, 80%)"
|
||||
}
|
||||
},
|
||||
"state": {
|
||||
"success": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(142, 76%, 36%)",
|
||||
"foreground": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(0, 0%, 100%)"
|
||||
}
|
||||
},
|
||||
"warning": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(38, 92%, 50%)",
|
||||
"foreground": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(0, 0%, 0%)"
|
||||
}
|
||||
},
|
||||
"error": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(0, 84%, 60%)",
|
||||
"foreground": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(0, 0%, 100%)"
|
||||
}
|
||||
},
|
||||
"info": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(199, 89%, 48%)",
|
||||
"foreground": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(0, 0%, 100%)"
|
||||
}
|
||||
}
|
||||
},
|
||||
"ring": {
|
||||
"$type": "color",
|
||||
"$value": "hsl(220, 14%, 10%)"
|
||||
}
|
||||
},
|
||||
"spacing": {
|
||||
"0": { "$type": "dimension", "$value": "0" },
|
||||
"px": { "$type": "dimension", "$value": "1px" },
|
||||
"0.5": { "$type": "dimension", "$value": "0.125rem" },
|
||||
"1": { "$type": "dimension", "$value": "0.25rem" },
|
||||
"1.5": { "$type": "dimension", "$value": "0.375rem" },
|
||||
"2": { "$type": "dimension", "$value": "0.5rem" },
|
||||
"2.5": { "$type": "dimension", "$value": "0.625rem" },
|
||||
"3": { "$type": "dimension", "$value": "0.75rem" },
|
||||
"3.5": { "$type": "dimension", "$value": "0.875rem" },
|
||||
"4": { "$type": "dimension", "$value": "1rem" },
|
||||
"5": { "$type": "dimension", "$value": "1.25rem" },
|
||||
"6": { "$type": "dimension", "$value": "1.5rem" },
|
||||
"7": { "$type": "dimension", "$value": "1.75rem" },
|
||||
"8": { "$type": "dimension", "$value": "2rem" },
|
||||
"9": { "$type": "dimension", "$value": "2.25rem" },
|
||||
"10": { "$type": "dimension", "$value": "2.5rem" },
|
||||
"11": { "$type": "dimension", "$value": "2.75rem" },
|
||||
"12": { "$type": "dimension", "$value": "3rem" },
|
||||
"14": { "$type": "dimension", "$value": "3.5rem" },
|
||||
"16": { "$type": "dimension", "$value": "4rem" },
|
||||
"20": { "$type": "dimension", "$value": "5rem" },
|
||||
"24": { "$type": "dimension", "$value": "6rem" }
|
||||
},
|
||||
"font": {
|
||||
"size": {
|
||||
"xs": { "$type": "dimension", "$value": "0.75rem" },
|
||||
"sm": { "$type": "dimension", "$value": "0.875rem" },
|
||||
"base": { "$type": "dimension", "$value": "1rem" },
|
||||
"lg": { "$type": "dimension", "$value": "1.125rem" },
|
||||
"xl": { "$type": "dimension", "$value": "1.25rem" },
|
||||
"2xl": { "$type": "dimension", "$value": "1.5rem" },
|
||||
"3xl": { "$type": "dimension", "$value": "1.875rem" },
|
||||
"4xl": { "$type": "dimension", "$value": "2.25rem" },
|
||||
"5xl": { "$type": "dimension", "$value": "3rem" }
|
||||
},
|
||||
"weight": {
|
||||
"thin": { "$type": "number", "$value": 100 },
|
||||
"extralight": { "$type": "number", "$value": 200 },
|
||||
"light": { "$type": "number", "$value": 300 },
|
||||
"normal": { "$type": "number", "$value": 400 },
|
||||
"medium": { "$type": "number", "$value": 500 },
|
||||
"semibold": { "$type": "number", "$value": 600 },
|
||||
"bold": { "$type": "number", "$value": 700 },
|
||||
"extrabold": { "$type": "number", "$value": 800 },
|
||||
"black": { "$type": "number", "$value": 900 }
|
||||
},
|
||||
"lineHeight": {
|
||||
"none": { "$type": "number", "$value": 1 },
|
||||
"tight": { "$type": "number", "$value": 1.25 },
|
||||
"snug": { "$type": "number", "$value": 1.375 },
|
||||
"normal": { "$type": "number", "$value": 1.5 },
|
||||
"relaxed": { "$type": "number", "$value": 1.625 },
|
||||
"loose": { "$type": "number", "$value": 2 }
|
||||
},
|
||||
"letterSpacing": {
|
||||
"tighter": { "$type": "dimension", "$value": "-0.05em" },
|
||||
"tight": { "$type": "dimension", "$value": "-0.025em" },
|
||||
"normal": { "$type": "dimension", "$value": "0" },
|
||||
"wide": { "$type": "dimension", "$value": "0.025em" },
|
||||
"wider": { "$type": "dimension", "$value": "0.05em" },
|
||||
"widest": { "$type": "dimension", "$value": "0.1em" }
|
||||
},
|
||||
"family": {
|
||||
"sans": {
|
||||
"$type": "fontFamily",
|
||||
"$value": ["system-ui", "-apple-system", "BlinkMacSystemFont", "Segoe UI", "Roboto", "Helvetica Neue", "Arial", "sans-serif"]
|
||||
},
|
||||
"serif": {
|
||||
"$type": "fontFamily",
|
||||
"$value": ["Georgia", "Cambria", "Times New Roman", "Times", "serif"]
|
||||
},
|
||||
"mono": {
|
||||
"$type": "fontFamily",
|
||||
"$value": ["ui-monospace", "SFMono-Regular", "SF Mono", "Menlo", "Consolas", "Liberation Mono", "monospace"]
|
||||
}
|
||||
}
|
||||
},
|
||||
"radius": {
|
||||
"none": { "$type": "dimension", "$value": "0" },
|
||||
"sm": { "$type": "dimension", "$value": "0.125rem" },
|
||||
"md": { "$type": "dimension", "$value": "0.375rem" },
|
||||
"lg": { "$type": "dimension", "$value": "0.5rem" },
|
||||
"xl": { "$type": "dimension", "$value": "0.75rem" },
|
||||
"2xl": { "$type": "dimension", "$value": "1rem" },
|
||||
"full": { "$type": "dimension", "$value": "9999px" }
|
||||
},
|
||||
"shadow": {
|
||||
"xs": { "$type": "shadow", "$value": "0 1px 2px 0 rgb(0 0 0 / 0.05)" },
|
||||
"sm": { "$type": "shadow", "$value": "0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1)" },
|
||||
"md": { "$type": "shadow", "$value": "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)" },
|
||||
"lg": { "$type": "shadow", "$value": "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)" },
|
||||
"xl": { "$type": "shadow", "$value": "0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)" },
|
||||
"2xl": { "$type": "shadow", "$value": "0 25px 50px -12px rgb(0 0 0 / 0.25)" },
|
||||
"inner": { "$type": "shadow", "$value": "inset 0 2px 4px 0 rgb(0 0 0 / 0.05)" },
|
||||
"none": { "$type": "shadow", "$value": "0 0 #0000" }
|
||||
},
|
||||
"transition": {
|
||||
"duration": {
|
||||
"fast": { "$type": "duration", "$value": "150ms" },
|
||||
"normal": { "$type": "duration", "$value": "200ms" },
|
||||
"slow": { "$type": "duration", "$value": "300ms" },
|
||||
"slower": { "$type": "duration", "$value": "500ms" }
|
||||
},
|
||||
"timing": {
|
||||
"linear": { "$type": "cubicBezier", "$value": [0, 0, 1, 1] },
|
||||
"in": { "$type": "cubicBezier", "$value": [0.4, 0, 1, 1] },
|
||||
"out": { "$type": "cubicBezier", "$value": [0, 0, 0.2, 1] },
|
||||
"inOut": { "$type": "cubicBezier", "$value": [0.4, 0, 0.2, 1] }
|
||||
}
|
||||
},
|
||||
"zIndex": {
|
||||
"0": { "$type": "number", "$value": 0 },
|
||||
"10": { "$type": "number", "$value": 10 },
|
||||
"20": { "$type": "number", "$value": 20 },
|
||||
"30": { "$type": "number", "$value": 30 },
|
||||
"40": { "$type": "number", "$value": 40 },
|
||||
"50": { "$type": "number", "$value": 50 },
|
||||
"auto": { "$type": "number", "$value": "auto" }
|
||||
},
|
||||
"app": {
|
||||
"header": {
|
||||
"height": { "$type": "dimension", "$value": "60px" }
|
||||
},
|
||||
"sidebar": {
|
||||
"width": { "$type": "dimension", "$value": "240px" },
|
||||
"widthTablet": { "$type": "dimension", "$value": "200px" }
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user