coding-css
When css being written or edited.
When & Why to Use This Skill
This Claude skill acts as a specialized CSS architect, enforcing strict coding standards and best practices during the styling process. It ensures high-quality, maintainable front-end code by centralizing styles, prioritizing readability, and automating safe file management to prevent data loss during edits.
Use Cases
- Standardizing Stylesheets: Automatically maintain a single, clean 'main.css' file with consistent vertical spacing and readable syntax for better project organization.
- Refactoring Inline Styles: Efficiently migrate inline CSS to external classes to improve code separation and follow modern web development standards.
- Safe Code Iteration: Prevent file overwrites during rapid CSS editing by automatically appending timestamps to existing files when naming collisions occur.
- Preserving Documentation: Ensure that critical developer comments and logic explanations are retained while updating or simplifying CSS rules.
| name | coding-css |
|---|---|
| description | When css being written or edited. |
CSS coding standards
CSS in a single stylesheet: static/css/main.css.
Syntax & Style
Vertical spacing: Keep vertical spacing compact (no excessive blank lines). Readability: Prioritize readable code over "clever" one-liners. In-line css: Prefer use of classes from .css files to in-line css, unless explicitely justified.
Comments
Preserve comments: Do NOT delete existing, still relevant comments.
Logic & Operations
File Collisions: If a file exists, append _[timestamp] to the new filename. Simplicity: Choose the simplest working solution.