feat(landing): DesignFeatureFlow section - #46
Merged
Merged
Conversation
…ature skill Six-phase pipeline (00–05) walking from framework discovery to visual+behavior QA, with a Markup-boost callout per phase showing where the platform turns a manual step into a hosted, addressable artifact (pin, version, diff). Includes a small SVG rail diagram above the cards and a 'Design loop' link in the topbar nav. No new dependencies — pure CSS + inline SVG built on the existing landing primitives (Section, Eyebrow).
Coverage report
|
- Drop the SVG pipeline rail (visual noise; the card grid already telegraphs the sequence). - Remove the per-card 'Markup ↗' label — the styled callout already reads as a highlighted note; the label was redundant. - Reposition the section as a third-party-skill pairing rather than a Markup-native flow. New lead leads with the value: lock UI before talking implementation. Adds a ghost-pill link to the skill repo (AlexandreCamillo/markup-design-toolkit).
…ills markup-design-toolkit is deprecated. The skill family moved to github.com/alkg-cloud/design-skills.
- Remove FixLoopSteps (was '#how-it-works') and CompareTable; hide Pricing block until commercial framing is ready. Drop the topbar 'How it works' nav link and re-point the footer 'Agent API' link to '#design-loop'. - Rename topbar + hero CTAs from 'Spin it up' to 'Get started'. - Rewrite DesignFeatureFlow phase boosts to lead with 'With Markup,' and drop the API/code references in favor of outcome language. Rename phase 02 'Promote' to 'Lock the design' to match the new framing. - Footer copyright: Alexandre Camillo -> ALKG. - ThreeUp icons: swap glyphs for react-icons/vsc (VscPass, VscSymbolMethod, VscCode). - FAQ: drop 'How are pin coordinates persistent?' (already covered by ThreeUp 'iframe is the truth' card). - Quickstart: drop the agent-loop.sh curl card; the docker one is the whole quickstart now. Tighten the h2. - Replace em-dashes in user-visible copy across landing components.
- Drop boost callouts from phases 00 (Discovery), 04 (Plan + build), and 05 (Visual + behavior QA). Those phases stand on their own; the boost row was adding nothing concrete. - Phase 01: replace 'mockup goes online with one click' (untrue: there is no click, the agent uploads automatically as part of the skill flow) with 'every iteration is uploaded for you'.
FAQ, Quickstart, Contributors (and the hidden Pricing) used Section width="narrow" which capped them at 980px while the default sections sit at 1200px. That left section titles unevenly aligned across the page. Removing the narrow variant entirely (CSS + Section types + callers) collapses every section onto the same 1200px container.
The two failing landing.spec.ts tests still looked for a "Drop pin"
button that has not existed since the ViewerShell migration. The
demo's create-annotation flow now: click "New annotation" → click
inside the iframe (title="Mockup") → fill the draft textarea ("Annotation
body") → click "Send" → annotation card appears with data-pin-target.
Drops the window.prompt mock (the old DraftCard used prompt, the new
one is a real textarea). Reset test uses the same flow to seed a 4th
annotation before exercising the two-click reset.
The /Reset|Click again/i regex used to disambiguate the demo's reset button now also matches the CanvasToolbar's zoom-reset button (aria-label 'Current zoom 100% - click to reset'), which appeared after the ViewerShell migration. Narrow the regex to 'Reset demo' so only the intended button is targeted.
Covers eyebrow + headline + lead + repo CTA, all six phase cards in order, the boost-callout pattern (only on phases 01/02/03), and the closing coda paragraph. Restores the line coverage that was lost when FixLoopSteps and CompareTable were removed in the previous commits on this branch.
These components had no direct tests before; adding minimal render tests lifts branch + line coverage to recover the regression introduced by removing FixLoopSteps and CompareTable. The FAQ test also pins the removal of the 'pin coordinates' question so it can't drift back in unnoticed.
These two pure helpers were sitting at 0% coverage and counted against the project ratchet. Adding unit tests against their full surface (every align path, every clamp branch, every regex outcome) lifts line, statement, branch, and function coverage above the recorded baseline. Required to unblock the coverage ratchet — landing files are excluded from the coverage scope by design, so the four landing-only test files added in earlier commits don't show up in the totals.
AlexandreCamillo
added a commit
that referenced
this pull request
May 29, 2026
Brand alignment: the public-facing owner string now matches the GitHub org (alkg-cloud). Affects copyright (README, CLA, footer was already updated in #46), the dev seed admin display name (with the qa-dev-flow doc updated to reflect the new 'AL' avatar resolution), the sample agent-context payload in docs, the avatar JSDoc example (swapped to 'Jane Doe' so the two-word case is still demonstrated), and the AnnotationCard / Comment tests that hard-coded the previous name.
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.
Summary
Adds a new section to the landing page explaining the design-feature skill — the 6-phase workflow that orchestrates a UI feature from "I want a pricing card" to a Design-System parity check.
Built on the existing landing primitives (`Section`, `Eyebrow`) — no new deps, no images, pure CSS + inline SVG.
Files
Test plan