← ClaudeAtlas

frontend-uilisted

Use when the user asks for app UI, frontend, visual, layout, interaction, customer-facing screen, dashboard, component, CSS, responsive, mobile, or browser-visible implementation work. Claude must own the UI implementation pass; Codex stewards, reviews, cleans up, verifies, and decides what ships.
PedroAVJ/swe-stack · ★ 0 · Web & Frontend · score 70
Install: claude install-skill PedroAVJ/swe-stack
# Frontend UI This is the mandatory Claude workflow for app UI and frontend implementation work. If the task changes application UI, visual behavior, layout, styling, interaction, customer-facing screens, dashboards, components, CSS, responsive behavior, mobile UI, or another browser-visible surface, Codex must use Claude for the UI implementation pass before editing those UI files directly. ## Contract 1. Claude owns the UI implementation pass. 2. Codex owns stewardship: scope, prompt quality, logs, diff inspection, cleanup, verification, and final shipping judgment. 3. Do not substitute a read-only critique for implementation unless the user explicitly asks for planning, critique, or no code changes. 4. Do not hand-edit UI first and ask Claude afterward. Claude must get the first implementation attempt for the UI surface. 5. If Claude cannot run, say that plainly before editing UI and treat any Codex-only UI work as a fallback with a named failure reason. ## Workflow 1. Inspect the relevant repo files enough to give Claude a grounded, narrow prompt. 2. Run the plugin implementation pass: ```bash python3 /path/to/plugins/claude/scripts/run_design_pass.py \ --repo /path/to/repo \ --mode implement \ --prompt "Implement the requested UI change. Keep scope narrow. Match the existing design system. Do not make unrelated changes." ``` Resolve `/path/to/plugins/claude` to the directory containing this skill, then use that plugin's `scripts/run_design_pass.py`. 3. Ins