frontend-alignment-doctor
CommunityFix frontend layout and spacing issues.
Authorralphjohn29
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill precisely diagnoses and rectifies frontend alignment, spacing, and layout inconsistencies that disrupt user interfaces and create a poor user experience.
Core Features & Use Cases
- Root Cause Analysis: Identifies the specific CSS rule causing alignment problems, prioritizing broad selectors that often hide the true issue.
- Minimal Fixes: Focuses on the smallest possible change to correct the problem, avoiding over-engineering or adding unnecessary styles.
- Use Case: When a button's icon is misaligned, this Skill will find the offending CSS rule (e.g., a broad
margin-bottomon all SVGs within a container) and suggest a targeted fix, like changing it to a direct child selector.
Quick Start
Use the frontend-alignment-doctor skill to fix the misaligned icon on the 'Upload Files' button.
Dependency Matrix
Required Modules
None requiredComponents
scriptsreferences
💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: frontend-alignment-doctor Download link: https://github.com/ralphjohn29/my-claude-skills/archive/main.zip#frontend-alignment-doctor Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.