feat(skills): add Product Hunt front-page launch card

[wuwangzhang1216]

Summary

A new skill — social-product-hunt-card — that renders Product Hunt launches as Sunday-newspaper front pages instead of the usual rounded-orange SaaS card. Sits inside the editorial signature already established by deck-guizang-editorial, magazine-poster, and doc-kami-parchment: Playfair Display + warm paper + brick accent + 1px hairlines, zero shadows / gradients / round corners.

The signature design move — "today's launch as front-page news": masthead with star ornaments and a 1px+4px double rule, big italic-accented serif headline, Playfair-italic lede, two-column body grid (editorial number stack on the left + Hunter's Note pull-quote on the right), middle-dot-separated topics (no pills), newspaper byline footer with LIVE NOW blink dot.

Hard-locked design system

Mirrored in SKILL.md and example.html:

• 5 hex tokens only — paper #f3eee2, tint #ece5d3, ink #1f1c17, muted #6e6a5d, rule #d3cdbe, accent #c2492c (brick-orange, between PH brand #DA552F and editorial #b85a3a — preserves PH brand recognition without going garish).
• 3 fonts with strict roles — Playfair Display (display + lede italic + big numbers), Inter (body + kicker), JetBrains Mono with tnum (metrics, dateline, folio).
• Hard bans — 0 drop-shadow, 0 gradient backgrounds, 0 corner-radius ≥ 4px, 0 blur, 0 multi-color accents. All forbidden in the prompt body and absent from the example.
• Subtle 16px radial-dot grain pattern overlaid on the paper bg.

Files

One folder; no registration step (picker auto-discovers via src/lib/templates/loader.ts):

File	Purpose
src/lib/templates/skills/social-product-hunt-card/SKILL.md	frontmatter (zh/en, category: card, scenario: marketing, aspect_hint: 1200×630, 6 tags) + prompt body locking the design system above.
src/lib/templates/skills/social-product-hunt-card/example.html	hand-authored 1120×~660 OG card showing html-anything itself as the launching product (self-referential — the maintainers' own future PH launch is the demo).
src/lib/templates/skills/social-product-hunt-card/example.md	launch-context input shape designed to teach the agent how to elevate a tagline into editorial headline + lede.

CONTRIBUTING merge-bar (per CONTRIBUTING.md)

• Real example.html ships in the folder
• Renders cleanly in Chrome headless at 1200×720 (see screenshot above)
• Hard constraints are specific (hex codes, font roles, px sizes, letter-spacing — not vague directives like "use modern typography")
• No lorem ipsum; example uses real product copy
• Slug uses ASCII lowercase with dashes; mirrors social-x-post-card, social-spotify-card, social-reddit-card
• Not vendored from another repo — no third-party LICENSE to ship

Test plan

• pnpm dev → open picker → confirm Product Hunt 头版报 appears under the Card / 卡 group
• Click the skill → load the bundled sample → ⌘+Enter to convert with an installed agent (Claude / Cursor / Gemini / …)
• Generated HTML respects the design tokens: paper bg #f3eee2, brick accent #c2492c, Playfair masthead, 1px hairlines, no shadows, no rounded corners ≥ 4px
• One-click .png export works against the generated card

Why this skill

The catalog already has social-x-post-card, social-reddit-card, social-spotify-card — but no Product Hunt launch card, the single most-shared social artifact in dev-tool launches. And rather than mimic producthunt.com's UI (every PH-launch screenshot already does that), this skill reframes the moment: launch day is news, so the card is a newspaper front page. That's the signature. It also gives the project itself a ready-to-use OG card for its own eventual PH launch.

[lefarcen]

Hey @wuwangzhang1216! 👋 The editorial newspaper concept here is genuinely distinct — reframing PH launch day as a front-page news moment rather than mirroring the orange SaaS card is a sharp angle, and the Playfair + brick-accent design system reads consistently with the other editorial skills.

One thing to flag before you mark this ready: the files are added at src/lib/templates/skills/social-product-hunt-card/ (repo root level), but this repo is a pnpm monorepo — the next package lives under next/, and the skill loader resolves its SKILLS_DIR relative to that package's working directory. All existing social cards (social-spotify-card, social-reddit-card, social-x-post-card) live at next/src/lib/templates/skills/. At the current paths, the picker won't discover your card.

The fix is a quick move: next/src/lib/templates/skills/social-product-hunt-card/. CONTRIBUTING.md says src/lib/templates/skills/ but it's written from inside the next/ package — easy to miss from the repo root.

Happy to do the full review once you've updated the paths and flipped this to ready. ✨

[wuwangzhang1216]

Thanks for the careful read, @lefarcen — you're right, the branch was based on a pre-monorepo main so the files landed at the repo-root src/. I rebased onto current main and moved the skill to next/src/lib/templates/skills/social-product-hunt-card/, alongside social-spotify-card, social-reddit-card, and social-x-post-card. The picker will now discover it via the next-package-relative SKILLS_DIR.

Force-pushed as 96f58cf. Ready for the full review whenever you have a moment.