agentgui 1.0.970 → 1.0.971

package/site/theme.mjs

@@ -15,6 +15,10 @@ const escapeJson = (obj) => JSON.stringify(obj)
   .replace(new RegExp('\\u2028', 'g'), '\\u2028').replace(new RegExp('\\u2029', 'g'), '\\u2029');
 
 const SDK_URL = 'https://unpkg.com/anentrypoint-design@latest/dist/247420.js';
+// Render-blocking CSS counterpart of SDK_URL so the kit base surface + .site-*
+// classes paint BEFORE the module's installStyles() runs (no FOUC). All design
+// content lives in the kit; this template carries no inline <style>.
+const CSS_URL = 'https://unpkg.com/anentrypoint-design@latest/dist/247420.css';
 const THIS_DIR = dirname(fileURLToPath(import.meta.url));
 
 const landingClient = `
@@ -27,16 +31,16 @@ const { site, nav, page } = data;
 function Hero() {
   if (!page || !page.hero) return null;
   return C.Panel({
-    style: 'margin:8px',
-    children: h('div', { style: 'padding:24px 22px' },
-      C.Heading({ level: 1, style: 'margin:0 0 8px 0', children: page.hero.heading || site.title }),
+    class: 'site-panel',
+    children: h('div', { class: 'site-hero' },
+      C.Heading({ level: 1, class: 'site-hero-h', children: page.hero.heading || site.title }),
       page.hero.subheading ? C.Lede({ children: page.hero.subheading }) : null,
-      page.hero.body ? h('p', { style: 'margin:8px 0 16px 0;color:var(--panel-text-2);max-width:64ch' }, page.hero.body) : null,
-      (page.hero.badges && page.hero.badges.length) ? h('div', { style: 'display:flex;gap:6px;flex-wrap:wrap;margin:0 0 12px 0' },
+      page.hero.body ? h('p', { class: 'site-hero-body' }, page.hero.body) : null,
+      (page.hero.badges && page.hero.badges.length) ? h('div', { class: 'site-chip-row' },
         ...page.hero.badges.map((b, i) => C.Chip({ key: 'b' + i, children: b.label }))
       ) : null,
-      (page.hero.ctas && page.hero.ctas.length) ? h('div', { style: 'display:flex;gap:8px;flex-wrap:wrap' },
-        ...page.hero.ctas.map((c, i) => C.Btn({ key: 'c' + i, href: c.href, primary: c.primary, children: c.label }))
+      (page.hero.ctas && page.hero.ctas.length) ? h('div', { class: 'site-cta-row' },
+        ...page.hero.ctas.map((c, i) => C.Btn({ key: 'c' + i, href: c.href, variant: c.primary ? 'primary' : 'default', children: c.label }))
       ) : null
     )
   });
@@ -54,7 +58,7 @@ function Features() {
   }));
   return C.Panel({
     title: page.features.heading || 'features',
-    style: 'margin:8px',
+    class: 'site-panel',
     children: rows
   });
 }
@@ -70,8 +74,8 @@ function Quickstart() {
   });
   return C.Panel({
     title: page.quickstart.heading || 'quick start',
-    style: 'margin:8px',
-    children: h('div', { style: 'padding:16px 22px' }, ...lineNodes)
+    class: 'site-panel',
+    children: h('div', { class: 'site-cli' }, ...lineNodes)
   });
 }
 
@@ -82,7 +86,7 @@ function Footer() {
     h('span', { class: 'item' }, '·'),
     h('a', { class: 'item', href: 'https://247420.xyz' }, '247420.xyz'),
     h('span', { class: 'spread' }),
-    site.repo ? h('a', { class: 'item', href: site.repo }, 'source ↗') : null
+    site.repo ? h('a', { class: 'item', href: site.repo }, 'source ->') : null
   );
 }
 
@@ -112,7 +116,7 @@ function Footer() {
     h('span', { class: 'item' }, '·'),
     h('a', { class: 'item', href: 'https://247420.xyz' }, '247420.xyz'),
     h('span', { class: 'spread' }),
-    site.repo ? h('a', { class: 'item', href: site.repo }, 'source ↗') : null
+    site.repo ? h('a', { class: 'item', href: site.repo }, 'source ->') : null
   );
 }
 
@@ -120,10 +124,10 @@ const App = C.AppShell({
   topbar: C.Topbar({ brand: '247420', leaf: site.title || '', items: navItems }),
   crumb: C.Crumb({ trail: ['247420', site.title || ''], leaf: page.title || '' }),
   main: C.Panel({
-    style: 'margin:8px',
+    class: 'site-panel',
     children: h('iframe', {
       src: page.embedSrc,
-      style: 'width:100%;height:calc(100vh - 180px);min-height:520px;border:0;border-radius:6px;background:var(--panel-1);display:block',
+      class: 'site-embed',
       title: page.title || ''
     })
   }),
@@ -140,7 +144,7 @@ const renderHtml = ({ site, nav, page, clientScript }) => `<!DOCTYPE html>
   <title>${escapeHtml(page.title || site.title)}${site.tagline ? ' - ' + escapeHtml(site.tagline) : ''}</title>
   <meta name="description" content="${escapeHtml(page.description || site.description || site.tagline || site.title)}" />
   <script type="importmap">{"imports":{"anentrypoint-design":"${SDK_URL}"}}</script>
-  <style>html,body{margin:0;padding:0}body{background:var(--app-bg,#FBF6EB);color:var(--ink,#1F1B16);font-family:var(--ff-ui,'Nunito',system-ui,sans-serif)}</style>
+  <link rel="stylesheet" href="${CSS_URL}" />
 </head>
 <body>
   <div id="app"></div>