Hero Studio - Commit

by adom

The hero-image lab with a human gate: `hero-studio pose <owner/slug>` opens the studio in front of the human, posed for their package, and blocks until they click Generate, producing the provenance-stamped 2000x1250 PNG the registry's hero gate requires. The image carries the title and artwork; the exported image also bakes the type pill (top right) and full wiki slug (bottom right); the page shows the hero bare, and only the homepage marquee overlays its own dynamic info. Every hero wears its P

Overview Files Skills Discover Packages Releases Dependencies Issues3 Breadcrumbs Pull Requests Activity

← Commit history

Publish 0.3.1

Colby Knox ·65b56c1d95 ·2mo ago ·parent 3d47622

4 files changed +37−4

data/pages.json+16 package.json+1−1 page.json+1−1 public/index.html+19−2

data/pages.json+16

@@ -348,5 +348,21 @@    "skillpack"   ],   "updated_at": "2026-07-16T01:45:22.990Z"+ },+ {+  "owner": "adom",+  "slug": "base-scaffold-control-panel",+  "type": "app",+  "title": "Base Scaffold Control Panel",+  "author": "Drew Owens",+  "score": 0,+  "stars": 0,+  "installs30d": 0,+  "brief": "The Base Scaffold System control panel: electrical specifications and the connect/disconnect interface between a base and a scaffold.",+  "tags": [+   "scaffold",+   "control-panel"+  ],+  "updated_at": null  } ]\ No newline at end of file

package.json+1−1

@@ -2,7 +2,7 @@   "slug": "hero-studio",   "title": "Hero Studio",   "type": "app",-  "version": "0.3.0",+  "version": "0.3.1",   "description": "A live playground for the hero image v2 definition: the lower third of every hero is a true-text overlay (type pill, trending score, stars, title, author, wiki slug) rendered by the surface, never baked into the image. Flip screenshot bleeds, brand tile themes, gradient angles, and title placement on real wiki trending data, and see the result in pixel-faithful wiki contexts: the homepage marquee, the index page card grid, and an adom-desktop style right bar. Includes a component-hero mode: real photo, raytraced render, or phong 3D fallback ladder, name plus spec-line hierarchy, and MPN placement options. Generate renders the posed hero server-side to a provenance-stamped 2000x1250 PNG via POST /generate.",   "license": "MIT",   "tags": [

page.json+1−1

@@ -2,7 +2,7 @@   "slug": "hero-studio",   "title": "Hero Studio",   "type": "app",-  "version": "0.3.0",+  "version": "0.3.1",   "description": "A live playground for the hero image v2 definition: the lower third of every hero is a true-text overlay (type pill, trending score, stars, title, author, wiki slug) rendered by the surface, never baked into the image. Flip screenshot bleeds, brand tile themes, gradient angles, and title placement on real wiki trending data, and see the result in pixel-faithful wiki contexts: the homepage marquee, the index page card grid, and an adom-desktop style right bar. Includes a component-hero mode: real photo, raytraced render, or phong 3D fallback ladder, name plus spec-line hierarchy, and MPN placement options. Generate renders the posed hero server-side to a provenance-stamped 2000x1250 PNG via POST /generate.",   "license": "MIT",   "tags": [

public/index.html+19−2

@@ -261,6 +261,8 @@ label.chk input { accent-color:var(--accent); width:14px; height:14px; cursor:po .l-mpn { font-family:'JetBrains Mono',monospace; font-size:.95cqw; color:#aeb8c4; display:none; } .l-slug { font-family:'JetBrains Mono',monospace; font-size:.95cqw; color:#00b8b1; text-decoration:none; } .l-slug:hover { color:#00e6dc; }+/* long refs shrink a step instead of eating the overlay (the studio-side answer to wiki#59) */+.l-mpn.fit, .l-slug.fit { font-size:.78cqw; }  /* ---------- component mode ---------- */ .hero[data-mode=component] .textzone, .hero[data-mode=component] .window { display:none; }@@ -673,6 +675,14 @@ function displayEntry() {   return pageByKey(state.page); } +/* long mono strings in the overlay: shrink a step past 40 chars; past 54,+   middle-truncate so the owner and the tail stay readable (full string in title=) */+function fitMono(s) {+  if (s.length <= 40) return { text: s, small: false };+  if (s.length <= 54) return { text: s, small: true };+  return { text: s.slice(0, 33) + '...' + s.slice(-18), small: true };+}+ function firstSentence(s, max) {   let t = (s || '').split(/(?<=\.)\s/)[0] || s || '';   if (t.length > max) t = t.slice(0, max).replace(/\s+\S*$/, '') + '...';@@ -748,9 +758,16 @@ function render() {   $('l-title').href = url;   $('l-author').style.display = state.overlay.author ? '' : 'none';   $('l-author').innerHTML = 'by <a href="' + url + '" target="_blank">' + d.author + '</a>';-  $('l-mpn').textContent = d.mpn || '';+  const mpnFit = fitMono(d.mpn || '');+  $('l-mpn').textContent = mpnFit.text;+  $('l-mpn').title = d.mpn || '';+  $('l-mpn').classList.toggle('fit', mpnFit.small);+  const ref = 'wiki.adom.inc/' + d.owner + '/' + d.slug;+  const refFit = fitMono(ref);   $('l-slug').style.display = state.overlay.slug ? '' : 'none';-  $('l-slug').textContent = 'wiki.adom.inc/' + d.owner + '/' + d.slug;+  $('l-slug').textContent = refFit.text;+  $('l-slug').title = ref;+  $('l-slug').classList.toggle('fit', refFit.small);   $('l-slug').href = url;    // controls reflect state