responsive-ui-qalisted
Install: claude install-skill divyanshu-iitian/agent-website-design-skills
# Responsive UI QA
Find root causes, not screenshot-specific patches. Produce evidence that the reported state works after the fix.
## Workflow
1. Read the repository's run and testing instructions. Start the app with its normal command.
2. Build a compact test matrix:
- critical routes or components;
- default, loading, empty, error, long-content, and interactive states;
- narrow mobile, mobile, tablet or narrow container, desktop, and wide desktop as relevant.
3. Reproduce the exact reported defect before editing. Capture the viewport, route, state, and interaction.
4. Inspect layout mechanics: containing block, grid/flex constraints, intrinsic size, min-width, wrapping, positioning, stacking, overflow, and fixed/sticky offsets.
5. Classify severity:
- **Blocker** - action or content is inaccessible;
- **Major** - interaction or comprehension is materially impaired;
- **Minor** - visible polish defect without task failure.
6. Fix the underlying constraint with the smallest coherent change. Avoid viewport-specific offsets unless the design genuinely changes there.
7. Test content stress: long labels, unbroken strings, localization expansion, missing/large media, validation text, and dynamic lists.
8. Test input and preference modes: keyboard, touch-sized targets, focus visibility, zoom when feasible, and reduced motion.
9. Re-run the failed case plus adjacent widths and states. Check that no new horizontal scroll or hidden content was introduced.
10. Rep