Use when building or changing Balaur's web UI — creating or modifying gomponents components (atoms, chat organisms like the chat Dock, domain cards, the page shell), wiring Datastar interactions, adjusting layout/proportions/spacing, making the UI responsive, fixing accessibility or theming/legibility, or adding/updating storybook stories. Use this whenever a task touches the web UI's markup, CSS (basm.css), responsiveness, or component structure — even if the user only says "the spacing looks off", "make it work on mobile", "this is cut off", or "fix the layout". Covers the Hearthwood design system + the layout-token scale (spacing/widths/breakpoints/z-index), the component layers, the storybook-as-source-of-truth workflow, the CSS/token conventions, responsive + a11y patterns, and the Datastar @post/SSE contract.
Install with
Claude CodeCodexCursorGitHub CopilotGemini CLI
Supported by the Atlas install prompt. Skill-specific requirements vary.
Skill stats
Skills1CategoryProduct & designStars0
About this skill
Use when building or changing Balaur's web UI — creating or modifying gomponents components (atoms, chat organisms like the chat Dock, domain cards, the page shell), wiring Datastar interactions, adjusting layout/proportions/spacing, making the UI responsive, fixing accessibility or theming/legibility, or adding/updating storybook stories. Use this whenever a task touches the web UI's markup, CSS (basm.css), responsiveness, or component structure — even if the user only says "the spacing looks off", "make it work on mobile", "this is cut off", or "fix the layout". Covers the Hearthwood design system + the layout-token scale (spacing/widths/breakpoints/z-index), the component layers, the storybook-as-source-of-truth workflow, the CSS/token conventions, responsive + a11y patterns, and the Datastar @post/SSE contract.
Quick start
Copy the install prompt. Use the green button above this README.
Send it to your agent. Paste it into your coding agent’s chat and send.
Review the setup. Your agent checks the skill’s instructions, requirements, and installation scope.
Use when building or changing Balaur's web UI — creating or modifying gomponents components (atoms, chat organisms like the chat Dock, domain cards, the page shell), wiring Datastar interactions, adjusting layout/proportions/spacing, making the UI responsive, fixing accessibility or theming/legibility, or adding/updating storybook stories. Use this whenever a task touches the web UI's markup, CSS (basm.css), responsiveness, or component structure — even if the user only says "the spacing looks off", "make it work on mobile", "this is cut off", or "fix the layout". Covers the Hearthwood design system + the layout-token scale (spacing/widths/breakpoints/z-index), the component layers, the storybook-as-source-of-truth workflow, the CSS/token conventions, responsive + a11y patterns, and the Datastar @post/SSE contract.
About this listing
Category
Product & design
Reported license
AGPL-3.0
Listing language (estimated)
English
Review status
Not individually reviewed
Agent compatibility
Atlas installation supports Claude Code, Codex, and Cursor. Skill-specific dependencies and features are checked during setup.
Claude Code
Codex
Cursor
GitHub Copilot
Gemini CLI