open/ktg-plugin-marketplace
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity Actions

feat(voyage): implement page-shell pattern (eyebrow + title + lede + meta)

Browse source
This commit is contained in:
Kjell Tore Guttormsen 2026-05-10 16:15:25 +02:00
commit 7c468097cf
1 changed files with 24 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

24
plugins/voyage/playground/voyage-playground.html
View file

@ -826,6 +826,30 @@ playground first-run shows a complete round-trip-able artifact.
'</div>';
}
// ---- v4.3 Step 9 — renderPageShell --------------------------------
// Universal page-header for dashboard + artifact-detail flater.
// Returns an HTML string wrapping body content with DS Tier 3
// page__eyebrow / page__title / page__lede / page__meta typography.
function renderPageShell(opts, bodyHtml) {
var o = opts || {};
var parts = ['<section class="page-shell">'];
if (o.eyebrow) {
parts.push('<div class="page__eyebrow">' + escapeHtml(o.eyebrow) + '</div>');
}
if (o.title) {
parts.push('<h1 class="page__title">' + escapeHtml(o.title) + '</h1>');
}
if (o.lede) {
parts.push('<p class="page__lede">' + escapeHtml(o.lede) + '</p>');
}
if (o.meta) {
parts.push('<div class="page__meta">' + escapeHtml(o.meta) + '</div>');
}
parts.push('<div class="page-shell__body">' + (bodyHtml || '') + '</div>');
parts.push('</section>');
return parts.join('');
}
// ---- DOM wiring ----------------------------------------------------
function $(id) { return document.getElementById(id); }