feat(wix-headless): full-page LLM generation — header + footer + home (CODEAI-696, experiment)#412
Open
yanivefraim wants to merge 5 commits into
Open
feat(wix-headless): full-page LLM generation — header + footer + home (CODEAI-696, experiment)#412yanivefraim wants to merge 5 commits into
yanivefraim wants to merge 5 commits into
Conversation
…the max-w-<size> collision (CODEAI-696) Root cause: compose.mjs emitted a named --spacing-* scale using t-shirt sizes (md, 3xl, …). In Tailwind v4 the width family (max-w-/w-/min-w-) is generated from the --spacing-* namespace, so `max-w-3xl` resolved to --spacing-3xl (~96px) instead of --container-3xl — collapsing any LLM/author-written reading column to one word per line. Hand-written templates dodged it; generated layout (#411/#412) tripped it. Fix — adopt Tailwind v4's built-in numeric spacing (the skill's values already match it 1:1, e.g. md=1rem=`4`, 4xl=6rem=`24`), removing the named scale so nothing collides with width keys: - compose.mjs: stop emitting named --spacing-*; drop it from REQUIRED, the DESIGN.md read, and the container≠spacing check. Tailwind's --spacing base (numeric gap-4/py-24/…) is used directly. Containers kept — now max-w-md/3xl/6xl resolve to --container-* correctly. - emit-design-tokens.mjs: stop projecting named --spacing-* into design-tokens.css / site.d.ts. - Migrated 112 spacing utility classes (gap-md→gap-4, py-4xl→py-24, …) and 122 var(--spacing-*) refs (→ literal rem) across 27 template + instruction-doc files. - Spec docs (DESIGN_MD, DESIGN_SYSTEM, STYLING): dropped the spacing token group (Designer no longer authors spacing) and corrected STYLING's (wrong) claim that max-w-3xl maps to --container-3xl. Verified: compose emits 0 --spacing-* and the 4 --container-* tokens; 0 leftover t-shirt spacing classes/var refs across templates+docs; both scripts parse. Live compiled-CSS/Playwright proof pending a network-capable build env. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
… (CODEAI-696, experiment) Fresh experiment off main. The LLM authors the ENTIRE visible page: the site header (Navigation.astro), footer (Footer.astro), and home page (index.astro). Only the plumbing stays composed — Layout.astro (html/head shell + ClientRouter + imports Nav/Footer), global.css, astro.config.mjs. - compose.mjs: new required inputs navPath / footerPath / homePath — each written verbatim; errors NO_NAV/NO_FOOTER/NO_HOME if missing. Manifest records nav/footer/home = "llm-generated". - Removed the Navigation.astro, Footer.astro, and index.astro templates. - BUILD-astro.md: documents the three-file generator dispatch + contracts (keep site-nav/site-footer classes + transition:persist + nav/home markers). No width guardrail in this branch (deliberately fresh — testing raw full-page generation). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
…ift-cards COMPONENTS (CODEAI-696) Follow-up to the numeric-spacing migration: the gift-cards component doc still told authors to fall back to var(--spacing-*), which no longer exists. Point at Tailwind's numeric spacing instead. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
845e5cd to
0229027
Compare
yanivefraim
added a commit
that referenced
this pull request
Jun 22, 2026
…ision (CODEAI-696) (#416) * fix(wix-headless): move spacing to Tailwind's numeric scale, killing the max-w-<size> collision (CODEAI-696) Root cause: compose.mjs emitted a named --spacing-* scale using t-shirt sizes (md, 3xl, …). In Tailwind v4 the width family (max-w-/w-/min-w-) is generated from the --spacing-* namespace, so `max-w-3xl` resolved to --spacing-3xl (~96px) instead of --container-3xl — collapsing any LLM/author-written reading column to one word per line. Hand-written templates dodged it; generated layout (#411/#412) tripped it. Fix — adopt Tailwind v4's built-in numeric spacing (the skill's values already match it 1:1, e.g. md=1rem=`4`, 4xl=6rem=`24`), removing the named scale so nothing collides with width keys: - compose.mjs: stop emitting named --spacing-*; drop it from REQUIRED, the DESIGN.md read, and the container≠spacing check. Tailwind's --spacing base (numeric gap-4/py-24/…) is used directly. Containers kept — now max-w-md/3xl/6xl resolve to --container-* correctly. - emit-design-tokens.mjs: stop projecting named --spacing-* into design-tokens.css / site.d.ts. - Migrated 112 spacing utility classes (gap-md→gap-4, py-4xl→py-24, …) and 122 var(--spacing-*) refs (→ literal rem) across 27 template + instruction-doc files. - Spec docs (DESIGN_MD, DESIGN_SYSTEM, STYLING): dropped the spacing token group (Designer no longer authors spacing) and corrected STYLING's (wrong) claim that max-w-3xl maps to --container-3xl. Verified: compose emits 0 --spacing-* and the 4 --container-* tokens; 0 leftover t-shirt spacing classes/var refs across templates+docs; both scripts parse. Live compiled-CSS/Playwright proof pending a network-capable build env. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * fix(wix-headless): drop stale var(--spacing-*) fallback guidance in gift-cards COMPONENTS (CODEAI-696) The gift-cards component doc still told authors to fall back to var(--spacing-*), which no longer exists after the numeric-spacing migration. Point at Tailwind's numeric spacing instead. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * fix(wix-headless): address #416 review — purge stale --spacing-* references (CODEAI-696) Review (adimara) flagged comments/docs that still referenced the removed named --spacing-* scale, plus a real breakage the main-merge re-introduced. Doc/comment fixes (stale references): - templates/global.css @theme comment: drop --spacing-* from the substituted list; reframe as "spacing is Tailwind numeric; never add --spacing-* (it powers the width utilities)". - gift-cards/components-gift-cards.css header: drop --spacing-{…} from reused tokens. - bookings/services/[slug].astro: the max-w warning's spacing-fallback rationale is obsolete post-fix — reframed (max-w-* now resolves to --container-*). - stores/ecom/COMPONENTS_CSS.md, shared/IMPLEMENTER.md: drop `spacing` from the DESIGN.md vocabulary list; swap the --spacing-md token example for --radius-md. - designer/INSTRUCTIONS.md: "spacing scale from @theme" → Tailwind numeric. Real functional fix: - bookings/components-bookings.css: the merged-in bookings rewrite (610d0ea) shipped 6 var(--spacing-sm/md/xl/xs) refs that resolve to nothing after the fix — migrated to literal rem (sm=.75 md=1 lg=1.5 xl=2 xs=.5). Forward guard (review point on namespace fragility): - STYLING.md: note that --spacing-* must never be reintroduced (it shadows max-w-*); custom spacing *values* should use a different namespace (e.g. --rhythm-*). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
main now contains #416 (numeric spacing fix) + the v1.10.0 release bump. Conflict resolution: - STYLING.md / designer/INSTRUCTIONS.md: took main's finalized #416 wording (the spacing-doc + the "never reintroduce --spacing-*" guard note); #412 only carried the pre-review-fix snapshot. - Navigation/Footer/index.astro: kept DELETED — the full-page branch generates header/footer/home via the LLM, so it has no templates for them. Full-page feature intact (compose nav/footer/home path inputs present); spacing fix intact (0 --spacing-* emitted, 0 var(--spacing-*) refs). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
4 tasks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Experiment: LLM generates the entire visible page
Fresh off main. Pushes generation as far as it goes: the LLM authors the site header, footer, and home page — not just the home body.
What's LLM-generated vs composed
Navigation.astro(header)navPath)Footer.astrofooterPath)index.astro(home)homePath)Layout.astro(html/head shell, ClientRouter, imports Nav+Footer)global.css,astro.config.mjsChange
compose.mjs— new required inputsnavPath/footerPath/homePath, each written verbatim; errors (NO_NAV/NO_FOOTER/NO_HOME) if missing. Manifest recordsnav/footer/home="llm-generated".Navigation.astro,Footer.astro,index.astrotemplates.BUILD-astro.md— three-file generator dispatch + contracts (keepsite-nav/site-footerclasses +transition:persist+ nav/home markers so chrome styling, View-Transitions, and vertical patches still work).Deliberately no width guardrail
Started fresh per request — this branch does not carry the
max-w-*collision guard from #411. So the raw full-page generation is exposed to that footgun; the test run will show whether/how often it trips, with header & footer now in scope too.Spectrum
#408 all-pinned → #410 LLM hero → #411 LLM home → this: LLM header+footer+home.
🤖 Generated with Claude Code