vibe-shop-normalizer

Topics in the source

• Vibe-Coded Storefront & Zero-CLS Normalizer
• Quick Start
• When to Use
• Best Practices
• Dependencies
• Examples
• Step-by-Step
• Validation

Turning tangled multi-pass HTML/CSS/JS shop files into crisp, light-themed, Zero-CLS storefronts that pass every test. A single-file or static HTML/CSS/JS storefront has accumulated duplicate navbars, conflicting dark/light overrides, or leaked ${...} literals Product cards jump or shift horizontally/vertically across mobile (320px), tablet (768px), and desktop (1024px+) viewports Converting an inconsistent dark/neon draft into a clean commercial light theme (#F4F5F7 canvas, #FFFFFF surfaces, #141619 primary actions) Synchronizing static storefront files (index.html, public/index.html) while keeping 100% of existing DOM unit tests green Audit existing unit tests (tests/.test.js) before touching markup so required IDs, hash routes (#/catalog, #/p/:id), and price classes stay intact. Strip leaked JavaScript template expressions (${...}) outside tags and remove duplicate or modal containers. Lock card aspect ratios (aspect-ratio: 1 / 1), title heights (min-height: 38px), spec heights (min-height: 32px), and button heights (h-10). Use font-variant-numeric: tabular-nums on all price, discount, and cart badge counters so digit updates never shift layout. Always call .unref() on recurring

This is an excerpt. Refer to the complete source and its current requirements.