mirror of
https://github.com/pbakaus/impeccable.git
synced 2026-09-17 08:36:25 +03:00
3fbf64698c86844504d307b51d7f7a3e7d3e542f
26
Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
 Paul Bakaus
|
3fbf64698c | Improve docs starter rail alignment | ||
|
Paul Bakaus
|
b4e4fe1079 | Improve docs starter experience | ||
  
|
397d3cb4b7 |
Add site copy feedback and command block fixes (#200)
* Add copy confirmation animation * Add live mode copy confirmation * Add Neo Mirai copy confirmation * Fix Neo Mirai command overflow on narrow screens * Link footer logo to homepage * Fix copy feedback helper --------- Co-authored-by: Paul Bakaus <43004+pbakaus@users.noreply.github.com> |
||
 Paul BakausandClaude Opus 4.8
|
1f975a69e4 |
Hero: vocabulary-first copy + command-palette switcher in the demo
Rewrite the hero around the why (the missing design vocabulary) instead of the live-mode how: "The missing design vocabulary for agents." The live demo now opens the picker's command palette and picks a verb before generating, which is the move that makes the live approach unique and was previously skipped. - Demo palette mirrors the real action picker (live-browser.js): same 12 verbs, the same SVG icons, a 4-col icon-over-label grid, selected chip on a kinpaku wash with its icon recolored. Light + dark covered. - Shared <LiveDemoPalette> component renders the grid from one list, so the hero and /live-mode no longer hand-copy the markup. /live-mode lands on "delight", the hero on "colorize" (via data-demo-pick); pages without a palette filter the switcher beats out of the shared timeline. - Trim the opening beats so the cursor clicks the element at ~1.3s (was ~2s), and slow the palette browse so the vocabulary is readable. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
|
Paul BakausandClaude Opus 4.8
|
6c7c04866c |
Fix dark changelog/FAQ cards in light mode
The changelog + FAQ pages share changelog-faq-kinpaku.css, which paints its card/panel/pill backgrounds with literal dark oklch(8% …) values that don't flip with the theme. The only light override was dead twice over: scoped to a .changelog-faq-kinpaku wrapper that's never on the body (these pages use .kinpaku-surface), and naming the wrong elements (.faq-item/.changelog-entry instead of the cf-prefixed classes). So the cards stayed near-black on the light page. Replace that dead block with correct html.light .cf-* rules: flip the card surfaces (cf-entry, cf-stats, cf-faq-item, cf-entry--current), the before/after frame + before tag (cf-ba-shot, cf-ba-tag--before) to the shared light card treatment, and drop the bright-kinpaku accents (cf-version, cf-stat-num, cf-current-badge, cf-ba-tag--after, cf-faq-question) to --ks-kinpaku-ink so they stay legible on paper, matching the .cf-eyebrow. Answer-body tokens already flip, so they're untouched. Dark mode unaffected. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
|
Paul BakausandClaude Opus 4.8
|
198aa91719 |
Color the command palette by section accent; vibrant dividers
Each command section now reads in its own category accent (--spread-accent) across the palette: the kicker, the skill name (big title + active list item), and the divider all take it, while the slash before /impeccable drops to the muted namespace ink. The per-section divider accents are also made vibrant — refine/simplify/harden were muddy kinpaku-pale/-deep/oxide; now create/refine/simplify = kinpaku gold, evaluate/harden = patina verdigris, system = neutral, matching the established category color grouping. Light mode re-applies the accents over the shared eyebrow :is() rule; dark mode picks them up from the base rules. Also includes light-mode readability fixes for the live-demo G-bar (brand mark, active tool chip, control chips, pin-note text/caret) and a specificity fix so the hotel-hero demo text stays light on its photo. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
|
Paul BakausandClaude Opus 4.8
|
1d5d745823 |
Make theme switcher three-way (auto/light/dark)
Default is "auto", which inherits from the OS via prefers-color-scheme and follows it live. Clicking cycles auto → light → dark → auto; the explicit choice persists in localStorage while auto stores nothing. The toggle shows the active preference (half-circle / sun / moon) keyed on a new data-theme-pref attribute, so "auto" is its own visible state rather than collapsing into whatever the OS resolved to. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
|
Paul BakausandClaude Opus 4.8
|
05942485d6 |
Use pristine kinpaku in light-mode command palette
The palette's title, active command, and category kicker rendered in the muddy kinpaku-ink in light mode (the shared eyebrow rule swaps pristine kinpaku for kinpaku-ink for legibility on warm paper). But the palette sits on a near-white card, where pristine kinpaku reads fine — and it now matches the already-pristine slashes and the PALETTE toggle. Scope the override under .magazine-container so it only affects the palette and clears the eyebrow rule's :is() specificity (inflated to 4 classes by its .fisheye-item.is-active argument). Other eyebrows keep kinpaku-ink for paper legibility; dark mode is unchanged. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
|
Paul BakausandClaude Opus 4.8
|
5083000125 |
Fix periodic-table view in light mode
The dark periodic table hardcodes a black stage and near-black tiles with !important, and the only light override targeted .ptable-cell — a class the component never emits (it renders .ptable-element). So in light mode the tiles stayed black while the symbol/name text flipped to dark ink: black on black, unreadable. Add a proper light block (with !important to beat the dark rules): a soft light stage, raised near-white tiles with neutral hairline borders and a subtle shadow, and a darker hover border. Symbol/name colors and the category labels already re-theme to dark inks, so they read cleanly. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
|
Paul BakausandClaude Opus 4.8
|
be83085dbd |
Remove unused --ks-rule-strong token
After the border audit reassigned every usage to --ks-kinpaku or --ks-rule, the muddy gold token is dead. Delete its dark and light definitions and update the comments that described it. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
|
Paul BakausandClaude Opus 4.8
|
2a605f63ca |
Replace muddy gold borders with pristine gold or neutral hairlines
Audit every --ks-rule-strong usage (the muddy desaturated gold). Where the border/text sits beside pristine kinpaku or signals an active/hover/ brand state, lift it to --ks-kinpaku; where it's a large structural frame, window chrome, or paired with neutral siblings, drop it to the neutral --ks-rule hairline. Lifted to --ks-kinpaku: detector focus ring + secondary action buttons, design-system candidate caption + mini-ui "after" border, docs neon-case secondary/hero-shot-hover, docs flow/chain arrows, homepage slop-teaser hover + impeccable-card. Dropped to --ks-rule: design-system comparison-stage frame, docs neon-case-command frame, light-mode hero demo shell + split-label pill + live-demo pin-note. --ks-rule-strong is now unused outside its token definition. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
|
Paul BakausandClaude Opus 4.8
|
8e25f9955f |
Fix light-mode header contrast over hero seam
On wide viewports the hero's bright kintsugi seam sits under the top-right nav cluster, where dark light-mode text and the toggle/GitHub chips fight the gold. Add a contextual, light-only radial scrim anchored to the corner: it feathers out by 70% (no hard edge), is faded via --hp the moment the header glasses in on scroll, and is off below the mobile drawer breakpoint. Dark mode needs no treatment (cream text reads fine over the darker seam). With the scrim carrying the corner, the toggle and GitHub counter become refined hairline chips in light mode — neutral --ks-rule border, no fill (the GitHub pill previously used the gold --ks-rule-strong and a solid background). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
 Abdul WahabandGitHub
|
ea3e66b984 |
Fix GitHub Copilot logo and site mentions (#182)
* Fix GitHub Copilot site mentions * Fix mobile command blocks * Fix mobile nav drawer centering * Align mobile nav controls * Align mobile nav controls * Pad mobile nav drawer * Fix light mobile nav drawer * Remove light drawer active border * Restore light drawer active underline * Fix designing mobile layout * Tune designing mobile loop * Fix designing mobile section gutters * Keep polish commands on one mobile row * Fix designing mobile bento gutters |
||
|
Paul BakausandClaude Opus 4.8
|
0c05cb8d2b |
Lighten the IMPECCABLE wordmark from weight 500 to 400
The lockup read a touch heavy. Drop the brand wordmark to 400 across the header, footer, and the .ks-wordmark kit primitive so it stays consistent everywhere. Alumni Sans was only loaded at 500/600/700, so 400 is added to the font request (otherwise it would snap back to 500). DESIGN.md synced. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
|
Paul BakausandClaude Opus 4.8
|
4e985f68c0 |
Rework Get started section: add update instructions, fix layout rhythm
Closes the documentation gap from #177: how to update an installed version was nowhere on the site. Install and Update now sit as paired, equally-visible commands, with `npx impeccable skills check` and the Claude Code `/plugin` path called out alongside. Also a full pass on the section's composition: - Commit to left-aligned asymmetry so content has one spine and the gold seam owns the right edge, instead of floating left-of-center - Make the install command pop: bright kinpaku frame + gold `$` prompt + left-aligned mono so it reads as a runnable line, not a decorative chip. Update box mirrors it one notch quieter in patina (the "updated" state) - Group install/update/alternatives tightly, rule off the secondary surfaces, drop the duplicate "Get started:" closing label - Repurpose the "Stay updated" cell to "Follow along" so it stops colliding with the real Update command FAQ already had a strong #update entry; added the `skills check` companion for parity. Getting-started tutorial gains a short update note after Step 1. Both themes synced. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
|
c8e973b324 |
Site polish: de-warm the palette, refine chrome, clean up /designing (#176)
* fix(home): command-wheel contrast, slop copy, line-length Address P1/P2/P3 findings from /impeccable critique of the homepage: - Command wheel (The Language): off-center command names floored at ~1.43:1 contrast were illegible (WCAG 1.4.3 fail) and hid most of the 23-command vocabulary. Raise the fisheye opacity floor 0.25 -> 0.62, MIN_SCALE 0.35 -> 0.52, and lift the base color from --ks-text-muted to --ks-text. Off-center now measures >=4.59:1; full list stays scannable while gold + size + weight still carry focus. - Slop section copy: rewrite all 7 discipline cards off the uniform "No X. No Y. No Z." triad into varied cadence with positives, and lead the section with what Impeccable does instead of the "Skills can't..." negation pivot. Drops the en-dash joiners too. - Line length: cap .downloads-rebuild-note (was unbounded, ~102ch) and tighten the homepage .section-lead 68ch -> 62ch (rendered ~86 actual chars/line). The diagonal plinth ramp on the slop grid is intentionally kept per design preference. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * refactor(home): de-warm and brighten the text ramp Warmth now lives only in the gold accents and surfaces, not the type. Body, headings, and the secondary tiers read crisp on lacquer instead of mushing into the warm floor: - --ks-champagne 84% .035 82 -> 91% .006 90 (headings/strong, now neutral; token name kept for compatibility) - --ks-text 81% .03 82 -> 88% .008 90 (body) - --ks-text-muted / -faint / -mute-deep lifted and de-warmed to match DESIGN.md frontmatter + prose synced to the new values. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * refactor(home): outlined testimonials + cleaner hero boundary Testimonials: - Flatten the double container: drop the t-plinth shelf wrapper (markup + CSS); the marquee sits directly in the section and carries its inset. - Outlined cards: no fill, 1px solid neutral border (oklch .64 0 0 / .22), no dead drop-shadow. Removes the mushy gray-on-gray blend and the stacked dotted-divider + gold-hairline chrome. - Section has no background of its own (rides the body lacquer gradient) and no top padding, so cards sit right under the hero divider. Hero: - Drop the bottom fade and the top nav scrim; the kintsugi art runs at full strength. A 1px neutral border-bottom (matching the card border) marks the testimonials boundary instead of a wash. - "How it works" is the kit ghost link (white), not an outlined button. Foundation/slop cards: lift the surface 9% -> 15% so they read as raised specimen cards instead of vanishing into the ground. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * refactor(live): quieter, more refined picker chrome Gold is reserved for the brand mark and the active control instead of ringing every container. Applied to the homepage demo, /live-mode, and the real injected picker (skill/scripts/live-browser.js, rebuilt into the harness dirs): - Container: neutral 1px hairline + tight neutral shadow (was a 1.5px gold border + gold halo ring); radius 10px -> 8px. - Active toggle: crisp graphite pill with gold text (was a murky kinpaku-dim wash). - Internal control borders (action pill / input / count): neutral hairline (was a warm gold rule); configure-row controls share one 30px baseline. - Pick outline: crisp 1.5px line, no soft gold glow ring; tighter radius. - Demo browser chrome: small uniform neutral dots, neutral URL pill, slimmer bar; frame edge neutral hairline + tighter shadow that registers on dark. DESIGN.md "Live Mode Picker" spec + "Picker Is Brand Rule" updated. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * refactor(design): neutral default hairline (--ks-rule) The default border/divider token was a warm gold hairline, used ~200x as the site-wide default border — so every small label, pill, counter, card, and divider carried warmth. Redefine it neutral so borders read clean; gold stays where it signals. - --ks-rule oklch(58% 0.065 82 / 0.32) -> oklch(78% 0 0 / 0.16) - --ks-rule-strong (active/focus/brand borders) unchanged, still gold - GitHub star pill: explicit near-white border (oklch 92% 0 0 / 0.18) - DESIGN.md hairline mirror + prose synced Verified across home, /design-system, and /docs. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * fix(home): testimonials separator + visible star-pill border - Move the dotted accent to the bottom of the testimonials (neutral dots) as a deliberate separator into the slop section; drop the oversized bottom padding to 1em so cards sit near the separator. - Star-counter pill: solid oklch(80% 0 0) border. The previous near-white at 0.32 alpha rendered as faded mid-gray on the near-black pill; a solid light border reads as the intended white hairline. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * refactor(design): neutralize body text (--ks-text) Drop the last bit of warm chroma from the body text token; it still read slightly warm at 0.008 chroma. --ks-text oklch(88% 0.008 90) -> oklch(88% 0 0) (pure neutral) DESIGN.md mirror + prose synced. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * refactor(design): neutral text everywhere Zero the residual warm chroma across the rest of the text ramp so no text tier carries warmth (warmth lives only in gold accents + surfaces). - --ks-champagne 91% .006 90 -> 91% 0 0 - --ks-text-muted 72% .01 90 -> 72% 0 0 - --ks-text-faint 62% .008 90 -> 62% 0 0 - --ks-text-mute-deep 52% .008 90 -> 52% 0 0 (--ks-text was already neutralized.) DESIGN.md mirror + prose synced. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * refactor(home): crisp, neutral Desloppification section - Foundation card background: oklch(15% .004 95) -> oklch(15% 0 0) (neutral graphite) so cards read crisp, not warm. - Plinth hatch: kinpaku gold -> neutral (oklch 80% 0 0 / .07) on a neutral base; the gold hatch was washing the section champagne. - Remove the plinth bottom mask-fade so the pedestals end on a clean edge. Gold stays only on the card icons as the accent. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * refactor(home): drop the homepage warm-token overrides The homepage redefined --ks-rule, --ks-rule-strong, and --ks-muted to warm values locally (an old "busier surfaces" tweak), so homepage borders and secondary text stayed champagne even after the global de-warm. That's why the Desloppification cards still read warm. - Remove the --ks-rule / --ks-rule-strong overrides; inherit the global tokens (neutral default border, gold strong/active border). - Alias --ks-muted to the global --ks-text-muted (no divergent value); legacy code still reads the --ks-muted name. Result: all homepage borders + secondary text are neutral; gold stays on accents (icons, mark, CTAs, active/focus). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * refactor(design): canonical code tokens (inline + block) Code styling was all over the place: homepage inline code was gold-on-gold, the slop CLI was a one-off gold-on-raised-lacquer, downloads used a separate --card-cmd-* set, docs used yet another. Add one shared token set and point the canonical surfaces at it. New :root tokens: - --ks-code-fg / --ks-code-bg / --ks-code-radius (inline: neutral chip) - --ks-code-block-fg / -bg / -border / -radius (block/CLI: lacquer terminal) - --ks-code-cmd (code that's a command link) Migrated: homepage inline code (was gold -> neutral chip), slop-teaser-cli (the "weird color" -> neutral terminal), downloads-cmd, and the docs inline + fenced-block rules (now the token source of truth; block text also neutralized). Remaining pages (designing, changelog/faq, detector, case studies) swept next. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * refactor(design): sweep remaining pages onto code tokens Point the rest of the site's code rules at the shared code tokens so inline code and blocks are consistent everywhere: - Inline code (designing, changelog, faq): gold -> neutral chip (--ks-code-fg / --ks-code-bg). - Detector rule pills + table cells: code text -> --ks-code-fg. - Neon-mirai case-study code block -> --ks-code-block-* tokens. Command tags (the gold /command pills: spread-flow-cmd, docs-flow-cmd, designing-phase-cmd, why-ci-cmd, etc.) are intentionally left as their own interactive category, not generic code. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * refactor(home): polish "The Language" section - Command tags (/polish, /adapt): gold command text on a neutral code chip (--ks-code-cmd / --ks-code-bg), dropping the muddy gold-tint border. - Commands panel kept as the solid oklch(0.17 0 0) panel (no border). - Demo preview cleaned up to a single framed split: strip the grid ::before, the gold-grid/radial-glow container background, and the inner drop-shadow; before-half inherits the panel, after-half is near-black, with one thin neutral border on the demo itself (caption sits outside it). - Periodic table: crisp flat neutral graphite tiles. Removed the JS-inlined category bg (var(--cat-*-bg)) + 1.5px colored border + hover drop-shadow, the gold-leaf ::before texture, the ::after accent line, the inset box-shadow, and the gold hover glow. Now a 1px neutral border, white symbols, readable neutral names, and a clean neutral-border hover with no shadow. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * refactor(design): roomier inline-code padding Inline code chips were tight top/bottom (the homepage one was only 0.05em). Add a --ks-code-pad token (0.3em 0.5em) and point every inline-code rule at it so the chips have consistent breathing room. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * refactor(home): drop non-steering commands from the command palette impeccable, init, extract, document, and live are setup/management commands, not steering verbs. Filter them out of the palette (fisheye + mobile carousel) via a shared PALETTE_EXCLUDED set. They stay in the periodic table, which is rendered separately by framework-viz.js. Palette: 23 -> 18 commands. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * fix(designing): flatten the pre-ship nested box The pre-ship cards were a box-in-box: a legacy .designing-polish-grid panel (cream bg + L/R/B border + padding, from docs-visuals.css) wrapping cards that already have their own border + fill. Override the grid to a plain transparent layout so the three cards are the only surface. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * fix(designing): remove step counter + flatten design-debt boxes - Drop the cryptic "03 · 04" pre-ship step counter (.designing-polish-band-meta) and tighten the band to a single bottom hairline. - Design-debt: flatten the box-in-box (bento plinth > tile > stage). The .designing-maintain-stage no longer adds its own border + fill; the demo sits directly in the bento tile. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * fix(designing): neutralize code/terminal/panel surfaces The terminal block, surface-cmd chips, command pills, live-frame, and other dark panels used a slightly-warm dark fill (oklch 1X% 0.006 95). Drop the warm chroma so they read neutral like the rest of the de-warmed site; the page ground + deep surfaces stay lacquer-warm. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * fix(designing): neutralize inline code + live-mock picker chrome - Inline code: the phase-sub and avoid-title code were still gold; point them at --ks-code-fg so all inline code reads neutral (gold stays only on command *links*). - docs-viz-live mock: bring the duplicated picker chrome in line with the refactored neutral treatment — neutral 1px container borders (no gold halo), neutral active "Pick" pill (was the kinpaku-dim wash), crisp pick outline (no glow), tighter radii. - CTAs (SEND ME ONE, Accept): pale-cream kinpaku-pale -> solid kinpaku gold. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * fix(designing): flatten lanes + avoid sections - Brand/Product lane mock cards: drop the inner border+fill box; the mock sits directly in the bento tile, separated by a top hairline (no plinth>tile>mock nesting). - "What to avoid" list: flatten the boxed list cards into a clean divided list (hairline separators, no per-item border/fill). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * fix(designing): clean up the Brand/Product lanes - Drop the bento plinth (0.17 fill + 8px gutter that drew the weird gutter "borders") and the tile fill; the two lanes sit on the page split by a single center hairline. - Brand mock title used the pinstripe display face at 1.6rem (reads broken at that size, the "champagne text"); switch it to the clean body face so it matches the product mock title. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * chore(site): update GitHub star count to 31k 31,188 stars as of now; header pill + aria-label were stale at 30k. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * Add Neo Kinpaku light mode across the site. Wire theme persistence and a header toggle, then layer light-mode overrides for docs viz contrast, command demos, live-mode pathway cards, and the designing/home surfaces. Co-authored-by: Cursor <cursoragent@cursor.com> * fix(designing): replace em dashes flagged by prose validator Brand/Product lane copy used em dashes ("the deliverable —", "the task —"); swap for colons per STYLE.md so the Cloudflare build's validateProse passes. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> * fix(designing): address Cursor bugbot nits - Fold the duplicate .designing-avoid { gap: 0 } override into the original rule (the gap: 18px was dead code). - Drop the leftover el.style.boxShadow = 'none' in the periodic-tile deactivate handler — activate no longer sets a box-shadow, so this only left a dead inline none that could suppress a future CSS shadow. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com> Co-authored-by: Cursor <cursoragent@cursor.com> |
||
|
|
e8e3665142 |
Live mode: staged AI copy edits (#158)
* feat(live): manual text-edit panel + Astro inject + stale-lockfile reap Adds a manual text-edit popover under the live-mode bar so users can retype copy directly without going through generate. The footer's "Apply edits" button fires a manual_edits event; the server writes the changes back to source via the new live-edit.mjs deterministic file mutator. Mirrors the wrap+accept flow but skips variant generation. New scripts: - skill/scripts/live-edit.mjs: writes manual_edits back to source - skill/scripts/live-text-rows.js: browser walker that surfaces every pure-text descendant of the picked element as an editable row Touched scripts: - skill/scripts/live-browser.js: text panel UI, CONFIGURING state hook - skill/scripts/live-poll.mjs: manual_edits routing - skill/scripts/live-server.mjs: manual_edits endpoint + handler - skill/scripts/live-wrap.mjs: small adjustments to support the flow Docs + tests: - skill/reference/live.md: manual-edit section - tests/live-edit.test.mjs, tests/live-text-rows.test.mjs Also bundles two live-mode reliability fixes that surfaced during manual testing of the feature: 1. live-inject now emits is:inline when the inject target is a .astro file. Astro otherwise processes the <script> tag and rewrites src to its own bundled URL, so the literal live.js never loads. 2. readLiveServerInfo now probes the lockfile PID with kill(pid, 0) and unlinks the stale lock if dead. Previously a crashed helper left server.json with a dead PID and live-poll reported "Live server not running" forever. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(live): inline contenteditable text editing Replace the text-edit popover panel with inline contenteditable activation. When an element is picked in CONFIGURING, every pure-text descendant becomes contenteditable="true" directly on the page. Each blur-event fires a single-op manual_edits save to source. Esc restores original text and stays in CONFIGURING; successful save exits to PICKING. If Go is clicked while a save is in-flight, the save completes before generate fires. Deleted ~340 lines of panel UI (initTextPanel, openTextPanel, closeTextPanel, renderTextRow, buildTextFooter, etc.). Added enableInlineEdit, disableInlineEdit, onInlineBlur. Server contract unchanged; live-edit.mjs handles per-op saves as before. Tests: 186 pass. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * fix(live): hide annotation overlay during inline edit Annotation overlay's click handler was intercepting clicks on contenteditable text elements. Hide the overlay when inline-edit is enabled to allow text selection and editing. Restore it when exiting inline-edit (if still in CONFIGURING). Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * feat(live): edit content badge mode with batched saves Replace automatic inline contenteditable on element pick with an explicit "Edit content" badge. The badge appears at the element's top-right corner when an element is picked. Clicking the badge enters a new EDITING state where: - The contextual bar hides - The annotation overlay hides - The badge morphs to show Cancel + Apply buttons - Text descendants become contenteditable inline Edits are held in memory (input event tracking) until Apply is clicked, which fires a single batched manual_edits event with all ops. Cancel discards drafts without saving. This eliminates the annotation overlay interference that prevented clicking on text elements. The EDITING state integrates with the main state machine and handles all exits (Esc, click-outside, teardown) cleanly. All 186 tests pass. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * fix(live): use row.el.tagName for tag in applyEditing op The applyEditing function was trying to use row.tag which doesn't exist on the row object. The tag should be the tagName of the text element itself (row.el.tagName.toLowerCase()). Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com> * feat(live): Edit content badge styling + auto-focus + separate buttons - Edit content button now matches Go button styling (BP.accent background, BP.mark text, FONT, transitions, hover effects) - Auto-focus first editable element when entering editing mode (50ms timeout) - Separate Cancel and Apply buttons with 8px gap (no divider) - Cancel uses muted styling (BP.hairline background, BP.textDim text) - Apply keeps brand accent styling - Remove all focus rings and outlines on edit badge buttons (no blue ring/outline in EDITING mode) Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com> * feat(live): Subtle button UI + cursor positioning + better copy - Change badge buttons to use impeccable-button aesthetic (ink background, surface text, hover to accent) - Removes aggressive styling conflict with Go button - No animations; simple 150ms background transition - Matches site design language (padding 0.625rem 1.5rem, 0.8125rem font, letter-spacing 0.03em) - Shorter, clearer button copy: "Edit" instead of "Edit content", "Save" instead of "Apply" - Fix cursor positioning: cursor now appears at END of text, not beginning - Use Selection API to collapse cursor to end of contenteditable element - Improves UX for immediate continuation of text - Update live.md documentation to reflect new button labels Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com> * fix(live): Use site design system colors for edit badge buttons - Edit/Save buttons: oklch(10% 0 0) background → oklch(60% 0.25 350) on hover - Cancel button: oklch(55% 0 0) background → oklch(65% 0 0) on hover - All buttons: 6px border-radius (matches Go button), oklch(98% 0 0) text - Smooth transition: 0.3s cubic-bezier(0.16, 1, 0.3, 1) (--ease-out) - Uses site color palette instead of live-overlay constants Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com> * fix(live): Match slop-callout style for edit badge buttons - Use exact .slop-callout aesthetic: paper background, accent border + text, uppercase 10px (0.625rem) - 600 weight, 0.06em letter-spacing, 4px 8px padding, 6px border-radius - Box-shadow: 0 2px 8px rgba(0,0,0,0.1) matches site callouts - Hover: inverts to filled background (accent fill, paper text) - Cancel uses ash color variant for muted state, Save uses accent - Smooth 0.3s cubic-bezier(0.16, 1, 0.3, 1) transition on background and color Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(live): Pill-shaped edit badge buttons, 2px padding, no uppercase - Border-radius: 999px (pill shape) - Padding: 2px 8px (more compact) - Removed text-transform: uppercase Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(live): Cancel button uses mist border + ash text - Border: 1px solid oklch(92% 0 0) (--color-mist) - Color: oklch(55% 0 0) (--color-ash) - Hover: inverts to ash background with paper text Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * fix(live): Remove blue focus outline from contenteditable elements in EDITING mode - Add inline outline: none on each row's element when contenteditable activates - Inject [data-impeccable-editable] CSS rule to override browser default focus ring - Use !important to win against site styles that re-apply focus outlines - Cleanup restores outline/data-attribute on disable Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(live): Decouple manual edits from agent/poll pipeline Manual text edits now POST directly to a new /manual-edit endpoint that runs live-edit.mjs synchronously and returns the result. The event is never enqueued, never reaches the poll loop, never reaches the agent. Why: every Save was costing an LLM turn. The poll script would dequeue the manual_edits event, run live-edit.mjs deterministically, post a completion ack, then print the event JSON to stdout. The Claude agent would read that output and decide "loop and re-poll". Zero real work for the agent but every Save burned context. Changes: - live-server.mjs: new POST /manual-edit handler that runs live-edit.mjs synchronously and returns the result. Does not enqueue, does not log to session store. Defense-in-depth: /events rejects manual_edits. - live-browser.js: applyEditing() POSTs to /manual-edit instead of sendEvent({type: 'manual_edits'}). - live-poll.mjs: removed manual_edits handler branch (dead code now). - reference/live.md: removed "Handle manual_edits" section; replaced with a one-line note that manual edits are server-direct. The HMR-triggered page reload remains (dev server detects source file change) but that is a separate dev-server behavior, not our pipeline. resumeSession() already restores variants and selection after reload. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(live): Stash manual edits server-side; commit via AI on request Decouples manual-edit Save from source file writes. Save now stashes to .impeccable/live/pending-manual-edits.json with no HMR refresh. The user explicitly asks the AI to commit when ready. Why: even with the prior /manual-edit fix, every Save still wrote to source and triggered the dev server's HMR/full reload. The page flash was the actual user pain. Now there's zero source touch on Save, and the user controls when the dev server reloads. Server (live-server.mjs): - /manual-edit-stash POST: append to buffer file. Returns {ok, pendingCount, totalCount, perPage}. - /manual-edit-stash GET: query counts by page for counter UI. - /manual-edit-discard POST: drop entries (all if no pageUrl). - Old /manual-edit returns 410 Gone (defense in depth). - Buffer ops merge by (pageUrl, ref): keep first originalText, update newText. CLIs: - live-commit-manual-edits.mjs: read buffer, shell out to live-edit.mjs per entry, truncate succeeded entries, surface failures. - live-discard-manual-edits.mjs: truncate buffer (optionally scoped by page). - Both take optional --page-url=<url>. Browser (live-browser.js): - applyEditing() POSTs to /manual-edit-stash, no source write. - Pending pill (• N staged) + trash icon next to Exit in global bar. - One-time onboarding toast on first Save: "Saved. Tell the AI to commit when ready." - Counter persists across reloads via GET /manual-edit-stash on init. - Trash icon: confirm dialog scoped to current page, then POST /manual-edit-discard. Variant pipeline interaction: - live-wrap.mjs: when wrapping an element, apply pending manual edits to the source range so the wrap block's "original" variant reflects the user's edited DOM (their pre-Go view), not the raw source. - live-accept.mjs: after accept writes the variant to source, scrub buffer ops whose originalText no longer appears in that file. The accept embodies the manual edit; the pending op is consumed. - Variant discard does NOT touch the buffer. Reference docs: - reference/live.md: full commit/discard contract, trigger guidance (narrow action-verb intent), do-not-auto-commit rule. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * feat(live): Staged-edits pill becomes an "Apply" button Click the "• N staged" pill → confirm dialog "Apply N staged edits to source? The page will reload." → POST /manual-edit-commit on the server, which shells out to live-commit-manual-edits.mjs. Same path the AI uses, just triggered from the overlay. Trash icon stays for discard. The AI-driven commit path also stays (useful for inspecting failures or scripting). The pill is now the primary apply affordance because it removes the chat-context-switch for the common case. Pill styling: pointer cursor, accent border + text at rest, fills on hover (accent bg, paper text). Tooltip: "Click to apply staged edits to source". First-save toast updated: "Saved. Click the 'staged' badge to apply, or ask the AI." Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> * chore(live): gitignore pending-manual-edits.json runtime buffer Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * chore: drop stray site/ test edits from PR Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * feat(live): Pill label reads "Apply N staged" Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(live): Manual edit ops use the leaf element's locator, not parent's Multi-row inline editing captures each contenteditable leaf (row.el) but the op was being built with selectedElement.id / classList — i.e. the parent card, not the editable text node. live-edit.mjs then searched source for the parent's class on the leaf's tag (e.g. <span class= "foundation-card">), found nothing, and silently failed. Use row.el's own id / classList instead. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(live): Climb to nearest classed ancestor when leaf has no locator A bare <em>/<strong>/etc. with no id or class produced ops the CLI rejected with insufficient_locator. Prefer the leaf's own id/class; if neither exists, walk up to the nearest ancestor with one and adopt its tag + locator. Text-replace still works because the CLI narrows by originalText inside the matched element's source range. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * feat(live): Make mixed-content paragraphs editable The text-rows walker skips elements with mixed children (text + element + text), so paragraphs like "Some text <code>x</code> more text" or "Body text · <a>link</a>" exposed zero rows for the surrounding copy. At edit time, wrap each non-whitespace direct text-node child in a marker span so the walker emits a row for it. Unwrap on save/cancel. The locator climbs to the parent's class as before, and live-edit narrows by originalText inside that parent's source range. hasTextRows now uses a lightweight subtree check that matches the new wrap+walk path so the edit affordance shows up on mixed-content elements. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(live): Address Cursor Bugbot findings (CB-2 through CB-6) CB-2 - Escape reverted DOM text but inlineEditDrafts retained the pre-revert value; clicking Apply afterwards committed the undone edit. Clear the draft entry when restoring innerText. CB-3 - The scrub gate !result.handled || result.handled !== false was a tautology that ran the scrub regardless of accept outcome. Use the intended result.handled !== false. CB-4 - The buffer-aware "original" content step in live-wrap iterated every entry in the buffer with no pageUrl filter, so an edit on /a could leak into a wrap call on /b. Add --page-url to the CLI; filter by it; skip the buffer-aware step entirely when omitted. live.md updated. CB-5 - removeEntries returned entry count while truncateBuffer returned op count, causing the discard CLI and HTTP endpoint to report mixed units. Make removeEntries return ops removed. CB-6 - applyTextReplace used string truthiness to gate prepending content above the edit, which silently dropped a leading empty line when the file started with '\n'. Gate on the line index instead, and mirror the fix on the trailing-empty-line side. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(live): A3+A4 data-integrity guards, A6 test coverage A3 — applyTextReplace refuses with text_ambiguous_in_block when originalText appears more than once in the matched element block. Refusing is safer than picking the first indexOf hit when we can't tell which leaf the user edited; user can rephrase one occurrence. A4 — newText is rejected if it contains <, >, {, }, or a backtick. Two layers: server-side validator in /manual-edit-stash returns 400, CLI-side guard in applyTextReplace returns invalid_chars_in_newText. Browser surfaces the specific reason via toast. The shared char list lives in live-edit.mjs (validateNewTextChars). reference/live.md documents the rule. A6 — New test files cover the orchestration gap: - live-manual-edits-buffer.test.mjs (17 tests across read/stage/ remove/find/count/truncate; pins removeEntries returns OPS count) - live-wrap-buffer-aware.test.mjs (3 tests; CB-4 regression test) - live-commit-manual-edits.test.mjs (4 tests; partial-failure, --page-url scope, no_pending_edits) - live-discard-manual-edits.test.mjs (3 tests; CB-5 unit consistency) - live-accept-scrub.test.mjs (4 tests; keep/drop/prune) Plus 2 new cases in live-edit.test.mjs for A3 and A4. Side-effect refactors: - scrubManualEditsAgainstFile accepts cwd for unit-testing and is exported. - Failed-op entries in live-edit.mjs now propagate forbidden and occurrences fields so callers can surface specifics. 41 tests across the 6 affected files pass; full suite green at 186/186. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * chore: drop .claude/pr-review.md from PR Local review notes belong in the working tree, not the PR diff. Kept in the file system; just untracked. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * chore: drop stray site/ test edits from PR (round 2) Live-inject script tag and the "Impeccable Works!" / "WHAT'S INCLUDED IN THE BOX" / "Wow Impeccable. ---- " strings were test edits that slipped back into the branch. Restore both files to match main. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * feat(live): Disable Edit badge while variants are generating Clicking Edit during GENERATING would open inline text editing on the same DOM region the variant wrapper is about to land in, racing the HMR and the mutation observer. The badge now switches to an 'idle-disabled' rendering (ash + mist, not-allowed cursor, disabled attribute, tooltip) the moment state transitions into GENERATING. Returns to 'idle' on the normal CONFIGURING re-entry paths. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(live): live-wrap refuses without --page-url when buffer has pending edits When a manual edit is staged ("Impeccable Works!") but not yet committed, the buffer holds the user's edited DOM while source still has the un- edited text ("Impeccable"). live-wrap's buffer-aware step exists to rewrite the wrap block's <div data-impeccable-variant="original"> to match the staged DOM, but per CB-4 it is gated by --page-url. When the agent invoking live-wrap omits --page-url, the buffer-aware step silently no-op'd and the variant authoring saw stale source — the user's manual edit appeared lost. Make the silent no-op a loud error: when buffer.entries.length > 0 and --page-url is missing, exit 1 with { error: 'missing_page_url_with_pending_edits', pendingEntries, hint }. Empty buffer = no risk = no requirement, so existing flows without pending edits keep working. Updated reference/live.md to flag --page-url as required when the buffer has entries. Added regression test in live-wrap-buffer-aware.test.mjs. live-wrap.test.mjs gained a buffer- clear hook so any leftover .impeccable/live/pending-manual-edits.json from local dev doesn't trip the new check. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * change back * chore: drop stray site/ test edits from PR (round 3) Live-inject script tag in Base.astro slipped back in via git add -A while a local live server was running. Restore both site/ files to main. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * Fix live manual edit staging * Rename live edit copy badge * Use sentence case for live edit copy badge * Move copy edit apply control outside live bar * Improve live copy edit apply flow * Clean up live copy edit AI apply flow * Polish live copy edit docs and toast * Fix staged copy edit review issues * Fix CI jsdom dependency * Fix Cursor Bot live edit findings * Fix remaining live edit review issues * Fix Bugbot staged edit edge cases * Fix latest Bugbot live edit edges * Fix remaining Bugbot wrap and discard issues * Fix live copy edit safety contracts * Fix copy edit rollback coverage * Fix live manual copy edit apply flow * Adjust live pending dock offset * feat(live): route manual-edit Apply through the chat agent Make the staged copy-edit Apply work when no CLI AI runner is authenticated by routing the batch through the active chat session, and surface runner failures clearly instead of opaque exit codes. - live-poll: add --reply --data '<json>' so the chat agent can return a structured manual_edit_apply result (the documented flag was missing, so the server resolved with an empty object) - live-server: manual_edit_apply event + deferred map, chat-vs-subprocess dispatch in /manual-edit-commit, resolve the deferred from the ack - live-copy-edit-agent: chat provider, extractRunnerErrorMessage and commandAuthed pre-flight, diagnostic describeNoProviderError; drop the stale CLAUDE_CODE_SIMPLE and --no-session-persistence flags so headless CLAUDE_CODE_OAUTH_TOKEN auth works - live-browser: clear pendingApplyInFlight on commit_done and add a watchdog so a missed signal can no longer freeze element picking - reference/live.md: tight Handle manual_edit_apply handler plus a separate diagnostics reference section; advertise the event in the opening contract and dispatch table Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * Add live manual edit apply coverage * Fix manual edit apply review issues * Fix manual edit review follow-ups * Fix manual apply poll acknowledgements * Fix manual apply failed-entry rollback * Clarify manual apply LLM prompt * Fix stale manual apply discard events * Fix manual apply dynamic source edits * Fix large manual apply chunks * Clarify manual edit apply is first-class work * Clarify manual apply resume flow * Compact live manual apply evidence * Reject malformed manual apply replies * Recover legacy manual apply summaries * Fix Astro live script injection * Add live manual edit apply coverage * Slim live manual apply flow * Slim manual edit test dependencies * Stabilize real browser LLM smoke * Generalize manual edit LLM prompt examples * Remove retired live edit wrapper * Inline live text row walker * Slim manual edit prompts * Drop AGENTS doc churn * Stabilize live manual apply prompts * Stabilize manual apply visible Haiku flow * Add hard framework manual edit coverage * Stabilize manual edit LLM retries * Fix manual apply transaction rollback * Fix live shader text capture * Clean up manual apply runtime artifacts * Fix live manual edit apply reliability * Clean up manual apply coverage * Slim manual apply test cleanup * Fix manual edit prompt contract test * Align manual edit cancel hover * Fix live loading shader capture * Fix manual apply review findings * Restore live e2e tests for CI * Fix live loading shader halftone * Tune live loading shader dots * Restore main live shader behavior * Fix manual apply review findings * Fix manual apply bot follow-ups * Clarify manual apply rollback changes * Fix manual apply state naming * Address PR review cleanup * Fix manual apply review follow-ups * Fix multiline manual apply verification * Restore inline drafts when hiding live bar --------- Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com> |
||
|
Paul BakausandClaude Opus 4.8
|
506f40607a |
fix(site): stop why-bento crunching inner mockups on wide viewports
The full-bleed breakout baked the (100vw - 1500px)/2 gutter into each edge tile's padding for title alignment. On the leftmost span-4 tile (DESIGN.md) that gutter grew faster than the column, so past 1500px the inner .why-dm-grid got squeezed as the viewport widened. Move the cap to .why-bento itself via margin-inline that only cancels .site-content's clamp side padding: below 1500px the rail stays edge-to-edge, at/above 1500px it caps at 1500px and centers with the page background on the sides. Tile content still aligns with the section headings, and columns stop growing so the mockups hold their size. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
|
Paul BakausandClaude Opus 4.8
|
f6a516940e |
site: filter changelog by component (Skill / CLI / Extension / All)
Bare /impeccable changelog defaults to Skill-only; CLI, Extension, and All toggle the rest. Component is derived from each entry's id prefix (cli-/ext-), so no per-entry tagging. Accessible button group, kinpaku segmented styling, shows all with JS off. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
|
Paul BakausandClaude Opus 4.8
|
d97bdef0e8 |
site: bump changelog/FAQ bold lead-ins to 600 (500 read too subtle)
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
|
Paul BakausandClaude Opus 4.8
|
1c812b85db |
site: normalize inline code size in changelog + FAQ answers
.cf-items code and .cf-faq-answer code never set a font-size, so inline code rendered at 1em and looked oversized next to the body text (the page doesn't load main.css's global code rule). Match the 0.92em already used by .cf-faq-question code. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
|
Paul BakausandClaude Opus 4.8
|
06eabc144a |
site: fix homepage hero overflow + tiny title on mobile
The hero clipped horizontally on phones: the collapsed grid used a plain `1fr` track whose min-content floor wouldn't shrink below the demo's 460px browser frame. Switch the mobile track to minmax(0,1fr) so it shrinks to the viewport and the frame clips its own content. Drop the container's redundant 56px side padding on mobile so the hero uses the standard 24px gutter. Also: collapse the demo's hotel-mock nav to logo + Book on mobile (its full 4-link nav overran the narrow frame and clipped mid-word), and give the scan-terminal `overflow-x: auto` so long lines scroll instead of clipping. The title keeps its design-system clamp (no mobile shrink): Alumni Sans Pinstripe is condensed, so it fits at 54px down to 320px, holding a ~3.2× hero hierarchy over the body. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com> |
||
|
|
9ffd3211d5 |
Neo Kinpaku design system + Live Mode v3 (#169)
* Add neo kinpaku design system page * skill: rip out baked-in category recipes and saturated-default motion tropes Programmatic bias mining (impeccable-evals) traced four major defects back to specific lines in this skill that contradicted SKILL.md's own first-order-reflex warning: - brand.md "Pairing and voice" prescribed four category→aesthetic recipes (editorial → serif+sans, tech/dev/fintech → tight tracking, consumer/food/travel → script/display serif, creative → rule-break). These directly drove OpenAI's 76% extreme-negative letter-spacing on tech briefs and Anthropic/Google's 28-34% italic-serif-display slop on editorial/food briefs. Replaced with one sentence: the shape depends on the brand, not on the brand's category. - brand.md "Brand permissions" had "Typographic risk. Enormous display type, unexpected italic cuts, mixed cases, hand-drawn headlines, a single oversize word as a hero." — a four-for-one slop driver behind 97% OpenAI comically-large H1, 42% bad-SVG illustration, and the editorial-italic slop. Deleted outright. - typeset.md and teach.md repeated the same category recipes; trimmed to the principle without the recipe. - SKILL.md Typography: added a hard hero-H1 ceiling (clamp() max ≤ 6rem ≈ 96px), with a <codex> block to make it explicit since OpenAI over-indexes here (97% ≥128px vs 24% for Anthropic). - animate.md, bolder.md, brand.md: removed "staggered reveals" and "scroll-triggered transitions" as the prescribed default ambitious motion. By 2026 that's the saturated AI tell, not a choreography. Reserved stagger for legitimate list-sibling rhythm. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * skill: anti-cream + codex-specific defect bans + universal slop bans Second pass after measuring more biases against the eval corpus. - SKILL.md Color: explicit "cream/sand/beige body bg is the saturated AI default of 2026" rule. Tone down the "tint every neutral" line so it doesn't read as "default to warm-tinted near-white" (which OpenAI hits at 74% and Anthropic at 31%-47%). - SKILL.md Absolute bans: add universal bans for two slop patterns detected at 55-95% across providers — tiny uppercase tracked eyebrow above every section (the 2023-era kicker that's now AI grammar) and numbered section markers (01/02/03). Also explicit "text that overflows its container is the universal defect on tablet/mobile." - SKILL.md Absolute bans → <codex> block: ban the GPT-specific defects Paul annotated repeatedly — `border:1px solid` + soft-wide-shadow (≥16px blur) "ghost cards", `border-radius:32px+` over-rounding, hand-drawn/sketchy SVG illustrations (loose-sketch / *-sketch classes, feTurbulence paper-grain filters), repeating-linear-gradient stripes, "X theater" AI-slop copy phrases. - SKILL.md Motion → <gemini> block: the image :hover transform tell (38% Google skill-on rate). Hover effects on images add no info; the image isn't an action target. Animate card chrome, not the image. - SKILL.md Typography: hard display letter-spacing floor ≥-0.04em (OpenAI defaults to -0.075em → cramped). Existing hero ceiling <codex> block extended with the letter-spacing rule. - codex.md Step A example: stop seeding "warm-grounded (deep oxblood + cream)" as the warm-palette template, which primes the cream default. - colorize.md Tinted backgrounds: stop printing the literal cream recipe `oklch(97% 0.01 60)`; replace with brand-anchored guidance. - document.md examples: warm-ash-cream → cool-paper so the example doesn't seed cream as the canonical neutral example. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * skill: universal anti-slop bans + contrast/font-count/all-caps-body rules Third pass after measuring the rest of the cross-provider matrix: - Color: explicit "Verify contrast" rule. Low-contrast text fires at 68% across all providers skill-on (90+% off). The most common failure is muted gray body on a tinted near-white; light-gray-for- elegance is named as the single biggest cause of unreadable AI pages. - Typography: max-3-font-families rule. Overused-fonts (>4 families) fires at 28% Anthropic / 36% Google / 0% OpenAI skill-on; >50% off. Also: universal "no all-caps body copy" (moved from brand-only ban to Shared design laws since product-register also overuses caps). - Copy: anti-aphoristic-cadence ban targets Anthropic's signature "X. No Y." / "X. Just Y." voice (63% skill-on copy-slop rate, 77% off — the worst rate in the matrix). Once-is-voice / three-or-more- is-tell framing per the runner's copy-slop detector. - Copy: anti-SaaS-buzzword-string ban with the literal phrase list the detector watches for (streamline/empower/supercharge, trusted- by-leading, best-in-class/enterprise-grade/cutting-edge, etc). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * skill: strengthen anti-cream rule across full warm-neutral band Smoke validation showed the cream fix worked for Google + OpenAI but Anthropic Sonnet italian-restaurant still shipped `--paper: oklch(90% .018 88)` — cream just outside the L≥95% band the rule cited. Broaden the rule: - Band: OKLCH L 0.84-0.97, C < 0.06, hue 40-100 (was 95-97% / 60-95). - Name the token-name tells explicitly (paper / cream / sand / bone / flour / linen / parchment / wheat / biscuit / ivory) — the model defaults to one of these regardless of what hex it lands on. - Call out the specific brief patterns ("warm, traditional, family- coastal-Italian" / "editorial-restraint") that the model translates into cream by reflex. Then provide three explicit non-cream options: saturated brand color, true off-white at C=0, or darker mid-tone. Warmth in the brand is carried by accent + typography + imagery, not by body bg. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * v3.2.0: skill bias-fix release Bumps version from 3.1.1 to mark the four-commit skill cleanup that rips out baked-in category recipes (brand.md), saturated-default motion tropes (staggered reveals everywhere), the cream/sand body-bg AI tell, codex-specific defects (1px+wide-shadow, over-rounding, hand-drawn SVGs, stripes, X-theater copy), the extreme-letter-spacing default, and universal slop bans (all-caps eyebrow on every section, numbered-section markers, all-caps body, font-family-count > 3, aphoristic copy cadence, SaaS buzzword strings). Plus a hard hero-H1 ceiling (clamp() ≤6rem) and a Gemini-specific image:hover transform block. Validated against ~190 post-fix samples — see impeccable-evals biases tab for per-provider deltas. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * drop "no pure black/white" rule entirely The rule was contested in the design world and causing more damage than good — pushing every page into the tinted-near-white default which is the cream/sand AI tell we already explicitly ban elsewhere. Vercel, SVKMS, Brutalist sites, et al. use pure black/white successfully; the skill shouldn't second-guess that. Skill markdown deletions: - SKILL.md Color: drop the "Never use #000 or #fff" bullet. - color-and-contrast.md: drop the "Never Use Pure Gray or Pure Black" subsection, the "Never pure black" table-row prescription, and the "Avoid: Using pure black for large areas" bullet. - colorize.md: drop the "NEVER use pure black or pure white for large areas" bullet. - polish.md: drop the "Tinted neutrals: No pure gray or pure black" half of the bullet (the gray-on-color bullet survives). Detector code (cli/engine): - registry/antipatterns.mjs: remove the `pure-black-white` entry. - rules/checks.mjs: remove the three `findings.push({ id: 'pure-black-white', ... })` emit points (inline #000 bg, Tailwind bg-black class, plain-HTML scan path). - engines/regex/detect-text.mjs: remove the two pure-black-white regex rules (CSS `background: #000…` + Tailwind `bg-black`). - detect-antipatterns-browser.js: regenerated via scripts/build-browser-detector.js. Tests: - detect-antipatterns-fixtures.test.mjs: invert the assertion that pure-black-white fires; expect it to NOT fire post-v3.2. Drop the Tailwind bg-black-opacity edge-case test (no longer relevant). - detect-antipatterns.test.js: drop the standalone "detects pure- black-white in styled-components" test and remove pure-black-white from the multi-detector assertions in PricingCard, globals.css, and GlobalStyle.tsx tests. 166 bun tests pass; 24 node fixture tests pass. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * skill: strip example patterns from copy rules, strengthen gemini block v3.2 rerun validation surfaced two issues: 1. Copy-slop detector fires more on Gemini under v3.2 (48% → 84%) than under no-skill baseline. Root cause: the anti-aphoristic-cadence rule printed the literal "X. No Y." / "X. Just Y." patterns as examples, and Gemini imitated them as the recommended voice. Same recipe-becomes- bias trap we hit with brand.md:116's "Enormous display type, unexpected italic cuts, mixed cases, hand-drawn headlines" enumeration. Fix: describe the cadence as a rhythm ("serious statement, then punchy short negation") without printing literal patterns. Buzzword list trimmed to a single inline phrase family rather than quoted strings. 2. Gemini image:hover transform Gemini-tell hadn't dropped (31% off → 32% v3.2). Strengthen the <gemini> block: explicit "Never animate <img> elements on hover", call out the Tailwind group-hover:scale / group-hover:rotate / group-hover:translate parent-hover patterns by name (Gemini was reaching for these via Tailwind even though the prior text talked about :hover on the image directly). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * skill: simplify context loading and inline register directive Replaces load-context.mjs's JSON output with a tight markdown block from the renamed context.mjs. The script now extracts PRODUCT.md's `## Register` field and appends a `NEXT STEP:` directive naming the matching reference (brand.md / product.md), which moved Gemini from skipping the register load entirely to honoring it. Drops the `.impeccable.md` auto-migration; makes IMPECCABLE_CONTEXT_DIR a lazy escape hatch consulted only when the default paths come up empty. Setup is now four bullets in one list. The DESIGN.md nudge is gone; in its place, a "familiarize with the existing design system" step that calls out CSS / tokens / running app as authoritative sources alongside DESIGN.md. The standalone `### Register` H3 stays for the cascade rules (task cue → surface → register field). New LLM-backed test suite at tests/skill-behavior/ runs five scenarios against claude-haiku-4-5, gpt-5.4-mini, and gemini-3.1-flash-lite via Vercel AI SDK. Captures real tool traces, asserts on context.mjs calls, brand.md loads, and teach.md fallback. Skips cleanly when API keys are unset. 13-14/15 pass; only stable failure is the v3.2.0-era gpt-mini S4 "don't re-run" regression. Adds @ai-sdk/google as devDep and the test:skill-behavior npm script. Touches em-dashes in skill/SKILL.md and four reference files so `bun run build:skills` passes its skill-prose validator. teach.md and document.md drop their "re-run the loader to refresh session cache" steps since the agent's own write is now the freshest source. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * skill: merge orphan reference files into command sub-skills + inline S-tier invariants Two related restructurings: 1. SKILL.md now carries the cross-domain invariants that catch defects in any project (contrast/placeholder/gray-on-color, similar-font pairing, text-wrap, tabular-nums, centered-stack default, Flex/Grid choice, auto-fit grids, semantic z-index, reduced motion, stagger vs section-fade, premium motion materials, focus-visible, placeholders-aren't-labels, dropdown overflow trap, button/link copy). Greenfield-only rules (theme picking, color strategy, tinted neutrals) live under "New projects only". 2. Reference files merged into their command counterparts: - spatial-design.md -> layout.md - motion-design.md -> animate.md - color-and-contrast.md -> colorize.md - responsive-design.md -> adapt.md - ux-writing.md -> clarify.md - typography.md -> typeset.md (bolder.md redirected) - cognitive-load.md + heuristics-scoring.md + personas.md -> critique.md craft.md and shape.md "load references" lists updated to new file homes. interaction-design.md stays standalone (no 1:1 command verb). Net: 36 -> 27 reference files. Same content, fewer files, no orphaned reference loaded only from craft.md. Also extends the routing rules: if the user's first word doesn't match a command but the intent clearly maps to one, load that command's reference and proceed as if invoked. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * skill: add sub-command + existing-project scenarios; move sub-command load to step 2 Adds three new LLM-backed scenarios to tests/skill-behavior: - S6: `/impeccable polish` → loads polish.md - S7: `/impeccable audit` → loads audit.md - S8: existing SvelteKit project (PRODUCT.md + DESIGN.md + src/app.css + src/lib/components/*.svelte + src/routes/+page.svelte) → agent reads at least one project code file to understand the existing design system S6/S7 surface a real model-floor: gpt-5.4-mini reads brand.md, reads the target index.html, and just does the polish/audit without ever loading the sub-command reference. Stronger SKILL.md wording didn't move it. Captured in the README baseline as a known weakness. Claude and Gemini honor the load reliably. To fix Gemini on S6/S7, sub-command reference loading is now Setup step 2 (right after context.mjs), not step 4 — placing it before the model gets focused on "doing the work". Step 3 (design-system familiarization) is tightened to require at least one project code read even when a sub-command reference loads in step 2, so Claude doesn't laser-focus on the sub-command flow and skip the broader exploration. Two new fixtures: MINIMAL_LANDING_HTML (a tiny static landing page for S6/S7) and SVELTE_PROJECT_FILES (a minimal SvelteKit scaffold with tokens, components, and a routes/+page.svelte for S8). Both designed to look real enough that agents treat them as production code. Suite is now 24 tests across three providers; baseline is 21-22/24, with the stable failures being gpt-5.4-mini scenarios 6 and 7. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * skill: add reveal-animation safety rule (must enhance, not gate visibility) Class-triggered visibility transitions pause on hidden tabs and headless renderers. The italian-restaurant smoke produced a build where 2 sections shipped opacity:0 because the CSS transition never advanced past currentTime=0 (timeline paused). Added one-liner under Motion to prevent the antipattern: reveals must enhance an already-visible default, never gate content visibility on a class-triggered transition. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * skill: restore prescriptive cream/sand/beige paragraph Bisection across 5 historical skill commits on Gemini 3.5 flash fast lane n=3 found that |
||
|
Paul BakausandGitHub
|
e1d3ea0b6f |
Detector architecture v2: static engine, benchmarks, lab, and visual contrast (#156)
* Add detector benchmark lab and visual contrast fallback * Expand visual contrast fixture coverage * Add browser visual contrast fallback * Show visual contrast overlays in detector lab * Fix detector lab short viewport layout * Fix detector lab visual overlays * Add visual contrast to browser scan overlays * Avoid browser scroll jumps during visual contrast scans * Resolve visual contrast lazily on scroll * Refresh detector lab visual counts lazily * Update pnpm lockfile for static parser deps * Address Bugbot detector API comments * Report extension visual contrast errors * Refactor detector into engine modules * Address Bugbot detector comments * Fix latest Bugbot detector notes * Fix visual contrast fixture labels * Refine detector lab fixtures * Fix stale detector overlay references * Fix detector lab fixture URLs * Fix typography lab fixture highlights * Fix typography lab page-level signal * Fix visual overlay lifecycle cleanup * Remove dead spotlight timer cleanup * Make browser async APIs reject consistently |
||
|
|
eecdfa128e |
fix(site): style Astro-rendered <pre> blocks in prose bodies (#133)
The Astro migration switched fenced code blocks from the hand-written `<div class="code-block-wrap"><pre class="code-block">` wrapper to Astro+Shiki's auto-generated `<pre class="astro-code">`. The existing CSS only targeted the legacy class names, so docs and tutorial code blocks rendered with no padding, no border-radius, and no margin. On top of that, the inner `<code>` inherited `.prose code`'s cream pill styling and showed it through Shiki's dark theme. Extends `.prose .code-block` rules to cover `.prose pre`, adds the missing margin and max-width, and resets `.prose pre code` to drop the inline-code background and border. Shiki's inline background color still wins on `.astro-code`, so the box keeps its dark theme; hand-written `.code-block` blocks on the case-study page get the warmer oklch palette as before. Co-authored-by: Claude <noreply@anthropic.com> |
||
|
|
b8f09c8142 |
Migrate site from Bun to Astro (#130)
* feat(site): scaffold Astro migration, convert 3 pages Phase 1+2 of the Astro migration: - Astro v6.2.1 installed, srcDir: 'site', static output to build/ - Shared layout: Base.astro (head, fonts, meta, slots), Header.astro (star count in one place: 23k), Footer.astro - CSS moved from public/css/ to site/styles/ (9 files, @import chains resolve via Vite) - Three pages converted: privacy, cases/neo-mirai, live-mode (all return 200 on astro dev) Remaining: designing, slop, homepage, content collections (docs), JS migration, server/index.js deletion, build.js cleanup. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * feat(site): migrate all 6 main pages to Astro Converts the remaining pages: - designing/index.html → site/pages/designing/index.astro (551 lines) - slop/index.html → site/pages/slop/index.astro (909 lines) - index.html → site/pages/index.astro (1278 lines, the homepage) Base.astro gains OG meta tag props, before-header/after-header slots (for grain overlay and section nav), and configurable mainId. Homepage uses link tags to public/css/ instead of frontmatter CSS imports to avoid esbuild choking on :has() in main.css. Curly braces inside <code> elements (CSS snippets in changelog) escaped with HTML entities to prevent Astro JSX expression parsing. All 6 pages return 200 on astro dev. Branch: feat/astro-migration. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * feat(site): content collections for docs and tutorials Replaces the 1532-line build-sub-pages.js generator with Astro v6 content collections: - 24 skill editorial files move to site/content/skills/ - 4 tutorial files move to site/content/tutorials/ - site/content.config.ts defines both collections with glob loaders - site/pages/docs/[...slug].astro reads skills collection + command metadata from source/skills/ at build time - site/pages/docs/index.astro renders the command grid grouped by category (create, evaluate, refine, simplify, harden, system) - site/pages/tutorials/ mirrors the pattern with ordered index - Doc.astro layout provides sidebar nav, breadcrumbs, and related- command chips from the COMMAND_RELATIONSHIPS data - Category/relationship data extracted to site/data/sub-pages-data.ts All 15 tested pages return 200: 6 main pages + 5 docs + 2 tutorials + 2 index pages. The old generator is not yet deleted (Task #6). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * feat(site): move JS source from public/js/ to site/scripts/ Moves all 49 JS files (app.js + 48 in js/) into site/scripts/. Vite now processes them through its module bundler instead of serving them raw from public/. app.js import paths updated from ./js/X to ./X (the js/ nesting is gone since app.js now lives alongside the subdirectories). Homepage and live-mode page switch from <script is:inline src="/app.js"> to Vite-processed <script> imports, so tree-shaking, bundling, and minification happen automatically at build time. public/js/ still exists for now (cleanup in Task #6) and the generated/counts.js build output path needs updating there too. @paper-design/shaders added to npm dependencies (was missing). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * refactor(site): delete old Bun server, generator, and duplicated files Cleanup after the Astro migration: Deleted: - server/index.js (233 lines, replaced by `astro dev`) - scripts/build-sub-pages.js (1532 lines, replaced by content collections) - scripts/lib/render-page.js (247 lines, replaced by Base.astro layout) - content/site/partials/header.html (replaced by Header.astro component) - public/index.html, privacy.html, designing/, live-mode/, cases/ (replaced by .astro pages in site/pages/) - public/css/ (moved to site/styles/) - public/js/ old source files (moved to site/scripts/) - public/app.js (moved to site/scripts/app.js) Kept in public/: - antipattern-examples/ (standalone HTML demos, not Astro pages) - antipattern-images/, assets/, neo-mirai/ (static assets) - js/detect-antipatterns-browser.js (referenced by antipattern examples) - js/generated/counts.js (build output from scripts/build.js) - _data/api/ (generated API data, now written to public/ so Astro passes it through to build/) Updated: - astro.config.mjs: added redirects (skills->docs, cheatsheet->docs, gallery->slop, neon-mirai->neo-mirai, etc.) - package.json: dev->astro dev, build->build:skills+build:site, preview->astro preview - scripts/build.js: removed buildStaticSite(), generateSubPages(), static-asset copying. API data writes to public/_data/ instead of build/_data/. Site-header validator is a no-op (shared component). Em-dash validator scans site/components + site/layouts, not pages (pages contain content from other sources like detector descriptions). - .gitignore: removed public/slop/ entry Tests: 186/186 pass. Skills build: clean. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(site): fix redirect config for Astro compatibility Move the dynamic /skills/:id -> /docs/:id redirect to public/_redirects (Cloudflare Pages native format) since Astro's redirect config can't handle dynamic routes that don't match existing page patterns. Remove duplicate trailing-slash redirect entries that caused warnings. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(site): switch remaining pages from /css/ link tags to frontmatter imports Doc.astro, docs/index, tutorials/index, and tutorials/[slug] were still using <link href="/css/sub-pages.css"> which pointed at the deleted public/css/ directory. Switched to frontmatter CSS imports (import '../../styles/sub-pages.css') which Vite resolves from site/styles/. Homepage also switches from link tags to frontmatter imports for main.css and sub-pages.css — the esbuild error that originally forced the link-tag workaround was caused by unescaped curly braces in the HTML content (since fixed), not by the CSS itself. All pages verified visually in Chrome: homepage hero, foundation grid, docs index (card grid with categories), docs detail (sidebar + editorial content + visual mockups), designing (core loop diagram), privacy, tutorials. Header renders with 23k stars on every page. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(site): fix edge-to-edge sections, broken API paths, CSS links Three fixes: 1. Homepage sections sat on the viewport edge because Base.astro's <main> lacked the site-content class (provides max-width + padding). Added mainClass prop to Base.astro; homepage sets mainClass="site-content". 2. "Failed to load commands" because app.js fetched /api/commands which only existed in the old Bun server's routing. Updated to fetch from /_data/api/commands.json (the static JSON files that build:skills writes to public/_data/). 3. CSS reference fix (previous commit was incomplete): Doc.astro, docs/index, tutorials pages all used <link href="/css/sub-pages.css"> pointing at deleted public/css/. Switched to frontmatter imports. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(site): add sidebar to docs index page The docs index was using Base.astro directly without the skills-layout grid, so it rendered without a sidebar. Added the same sidebar structure from Doc.astro (category-grouped command list) and wrapped the content in the skills-layout grid. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(site): extract footer CSS to shared file, import in Base.astro Footer was unstyled on sub-pages because footer CSS lived only in main.css (loaded by the homepage) not in sub-pages.css. Extracted the 95 lines of footer rules into site/styles/footer.css and imported it in Base.astro so every page gets footer styles regardless of which page-specific CSS it loads. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * feat(demos): move landing-demo into repo, add as slop specimens Moves ~/code/landing-demo/ into demos/landing-demo/ (without node_modules or the redundant .claude/.agents skill copies — the repo root's skill is found by walking up). PRODUCT.md, DESIGN.md, DESIGN.json, PROMPT.md, and SCRIPT.md stay in place so running Claude from demos/landing-demo/ picks up the project context. Also copies both pages as slop specimens to public/antipattern-examples/ with the detector script baked in: - new-slop-2026.html (Fraunces + warm cream editorial monoculture) - old-slop-2022.html (purple gradient + glassmorphism + neon glow) These can be linked from the slop page gallery alongside the existing 11 synthetic specimens. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * feat(slop): replace single demo iframe with Then vs Now comparison The "See it" section (01) on the slop page now shows two side-by-side browser frames: 2022 slop (purple gradients, glassmorphism, neon glow) and 2026 slop (Fraunces, warm cream, editorial restraint). Both run the detector overlay live — hover either to see which rules fire. Replaces the single visual-mode-demo.html iframe. Responsive: stacks vertically on viewports below 900px. Caption: "Same engine, different decade, both flagged." Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(slop): switch to single-frame era toggle, center the section Replaces the side-by-side dual-iframe layout with a single large frame and a segmented 2022/2026 toggle. Clicking the toggle swaps which iframe is visible (both pre-loaded, instant switch). Browser chrome title updates to match the active era. Centers the lede text and toggle above the frame for visual cohesion with the full-width iframe below. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(slop): left-align See It section, toggle inline with lede Moves the era toggle to the right of the lede paragraph using a flex row (align-items: flex-end). Left-aligned text + right-docked toggle matches the rest of the page's flow instead of standing out as a centered island. Stacks vertically on narrow viewports. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(slop): left-align iframe, remove max-width and auto margin The visual-mode-preview had max-width: 1040px + margin: 0 auto which centered it within the column. Override both in the .slop-then-now context so the frame fills the full content width flush with the text above. Caption left-aligned to match. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * chore(site): update star count to 24k (24,062) One file, one edit. The Astro migration working as intended. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(build): regenerate pnpm-lock.yaml for astro + shaders deps Cloudflare Pages uses pnpm with frozen-lockfile. The lockfile was stale after adding astro, @astrojs/cloudflare, and @paper-design/shaders via npm. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(build): resolve 3 bugbot review issues 1. Restore public/slop/ to .gitignore — prevents accidental legacy generator output from conflicting with the Astro page. 2. Move astro and @paper-design/shaders to devDependencies — these are site-build tools, not CLI runtime deps. Removes @astrojs/cloudflare entirely (unused; static output mode needs no adapter). 3. Fix Astro wiping build:skills output — CF config (_headers, _redirects, _routes.json) and API data now write to public/ so Astro copies them through. Dist ZIPs copy to build/_data/dist/ as a post-build step (after Astro finishes). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(build): merge duplicate devDependencies, use npx for astro CLI The previous commit created a second devDependencies key in package.json. JSON doesn't support duplicate keys — pnpm ignored the first block (with astro), so `astro build` wasn't found. Merged astro and @paper-design/shaders into the existing devDependencies block. Changed `astro build/dev/preview` to `npx astro build/dev/preview` so pnpm finds the local binary on Cloudflare Pages (which doesn't add node_modules/.bin to PATH by default). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(demos): remove private demo script and prompt from public repo SCRIPT.md contained a detailed conference talk script with personal delivery strategies, rehearsed Q&A answers, and venue details. PROMPT.md contained the origin brief for the demo page. Neither belongs in a public repo. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(build): gitignore generated public/ artifacts, consolidate redirects 1. Generated files written to public/ by build:skills (API data, CF config, browser detector, counts.js) are now gitignored. Prevents noisy diffs and merge conflicts from committed build artifacts. 2. Removed duplicate redirects from astro.config.mjs. All redirects now live in one place: the _redirects file generated by scripts/build.js (which Cloudflare Pages processes natively). Eliminates the dual-maintenance risk where the two sources could drift apart. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com> |