feat(design): implement Barcelona-Extropic/ConductorKit design prototype#6
feat(design): implement Barcelona-Extropic/ConductorKit design prototype#6Igor Holt (igor-holt) wants to merge 2 commits into
Conversation
…index.html Adds the full Genesis Conductor design prototype from the Barcelona-Extropic handoff bundle. The prototype covers three surfaces (Marketing, Dashboard, and Type Specimen), uses the ConductorKit token system with Barcelona-Extropic display typography, and ships with full SEO/llms.txt/robots.txt coverage. A beforeFiles rewrite in next.config.mjs serves public/index.html at "/" so the design is the live root page on both local dev and Cloudflare Workers. Switched index.html to production React 18.3.1 builds. https://claude.ai/code/session_01LdEjAkTynFMmdQrVsFkgi6
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This pull request implements the Barcelona-Extropic/ConductorKit design prototype, introducing core CSS frameworks, SVG assets, and a React-based application shell with marketing, dashboard, and specimen surfaces. The feedback identifies several technical improvements: replacing browser-side Babel transpilation with a pre-compilation build step to resolve performance bottlenecks, registering CSS custom properties via Property to enable smooth animation interpolation, and updating the canonical URL from a development subdomain to the production domain for proper SEO.
| <script src="https://unpkg.com/@babel/standalone@7.29.0/babel.min.js" integrity="sha384-m08KidiNqLdpJqLq95G/LEi8Qvjl/xUYll3QILypMoQ65QorJ9Lvtp2RXYGBFj1y" crossorigin="anonymous"></script> | ||
|
|
||
| <script type="text/babel" data-presets="react" src="components/Shared.jsx"></script> | ||
| <script type="text/babel" data-presets="react" src="components/Marketing.jsx"></script> | ||
| <script type="text/babel" data-presets="react" src="components/Dashboard.jsx"></script> | ||
| <script type="text/babel" data-presets="react" src="components/Specimen.jsx"></script> | ||
| <script type="text/babel" data-presets="react" src="components/App.jsx"></script> |
There was a problem hiding this comment.
Using @babel/standalone to transpile JSX in the browser is a significant performance bottleneck. It requires the browser to download a large library and perform compilation on every page load. For a production-ready prototype, these components should be pre-compiled into standard JavaScript using a build tool.
| @keyframes be-morph-sweep { | ||
| 0% { --be-morph-t: 0; } | ||
| 50% { --be-morph-t: 1; } | ||
| 100% { --be-morph-t: 0; } | ||
| } |
There was a problem hiding this comment.
CSS custom properties do not interpolate in animations unless they are explicitly registered with a type. Without registration, the value of --be-morph-t will flip instantly between 0 and 1. Register the property using @property to enable smooth interpolation.
@property --be-morph-t {
syntax: '<number>';
inherits: true;
initial-value: 0;
}
@keyframes be-morph-sweep {
0% { --be-morph-t: 0; }
50% { --be-morph-t: 1; }
100% { --be-morph-t: 0; }
}| <meta name="keywords" content="AI orchestration, agent graphs, LLM pipelines, model evals, Genesis Conductor, ConductorKit, Barcelona-Extropic, reproducible AI, STARK proofs, Kovach Enterprises"> | ||
| <meta name="author" content="Kovach Enterprises"> | ||
| <meta name="robots" content="index,follow,max-image-preview:large"> | ||
| <link rel="canonical" href="https://genesis-conductor-site.iholt-mymail-aacc-edu.workers.dev/"> |
There was a problem hiding this comment.
The canonical URL is currently set to a development Workers subdomain. It should be updated to the primary production domain (e.g., https://genesisconductor.io/) to ensure proper SEO and prevent indexing of development URLs.
| <link rel="canonical" href="https://genesis-conductor-site.iholt-mymail-aacc-edu.workers.dev/"> | |
| <link rel="canonical" href="https://genesisconductor.io/"> |
There was a problem hiding this comment.
Pull request overview
This PR replaces the existing Next.js root experience with a static ConductorKit/Barcelona-Extropic prototype served from public/index.html, adding three React-in-the-browser surfaces plus new crawler-facing text files and design assets. It shifts the site from the current App Router landing page toward a richer visual prototype while keeping the rest of the Next app in place behind a / rewrite.
Changes:
- Adds a static prototype shell in
public/index.htmlwith Marketing, Dashboard, and Specimen surfaces plus supporting JSX components. - Adds new brand/design assets and crawler-facing files (
robots.txt,llms.txt, SVG assets, CSS token files). - Rewrites
/innext.config.mjsto serve the static prototype instead of the App Router homepage.
Reviewed changes
Copilot reviewed 11 out of 13 changed files in this pull request and generated 18 comments.
Show a summary per file
| File | Description |
|---|---|
public/robots.txt |
Adds a static robots file with crawler directives and sitemap reference. |
public/llms.txt |
Adds AI-crawler-facing content describing the site’s surfaces and capabilities. |
public/index.html |
Introduces the new root HTML shell, metadata, third-party script loading, and bootstrapping. |
public/components/Specimen.jsx |
Adds the Barcelona-Extropic type specimen surface. |
public/components/Shared.jsx |
Adds shared UI primitives, tweaks state, nav, and controls used across surfaces. |
public/components/Marketing.jsx |
Adds the marketing landing surface, pricing, CTAs, and footer. |
public/components/Dashboard.jsx |
Adds the dashboard prototype with overview, pipeline, run, jobs, and eval views. |
public/components/App.jsx |
Wires the prototype surfaces together and mounts the React app. |
public/assets/logo-mark.svg |
Adds the brand logo mark asset. |
public/assets/illustration-waveform.svg |
Adds the dashboard waveform illustration asset. |
public/assets/conductorkit.css |
Adds ConductorKit design tokens and base styles. |
public/assets/barcelona-extropic.css |
Adds Barcelona-Extropic font/fallback styling utilities. |
next.config.mjs |
Rewrites / to serve public/index.html before App Router handling. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| User-agent: Google-Extended | ||
| Allow: / | ||
|
|
||
| Sitemap: https://genesisconductor.io/sitemap.xml |
| const surface = state.surface; | ||
| const setSurface = (s) => set({ surface: s }); | ||
| const beInWordmark = state.displayFont === 'be'; | ||
| return ( | ||
| <> | ||
| <TopNav | ||
| surface={surface} | ||
| setSurface={setSurface} | ||
| theme={state.theme} | ||
| setTheme={t => set({ theme: t })} | ||
| beFont={beInWordmark} | ||
| /> | ||
| {surface === 'marketing' && <MarketingSurface/>} | ||
| {surface === 'dashboard' && <DashboardSurface/>} | ||
| {surface === 'specimen' && <SpecimenSurface/>} |
|
|
||
| async rewrites() { | ||
| return { | ||
| // Serve the Barcelona-Extropic/ConductorKit design prototype at the root. | ||
| // public/index.html and its dependencies (assets/, components/) are served | ||
| // as static files; this rewrite intercepts "/" before the App Router sees it. | ||
| beforeFiles: [ | ||
| { source: "/", destination: "/index.html" }, | ||
| ], | ||
| }; | ||
| }, |
| <div style={{ display:'flex', gap:12, marginBottom:56, flexWrap:'wrap' }}> | ||
| <Button variant="primary" size="lg" icon="arrow" accent={accent}>Start free</Button> | ||
| <Button variant="secondary" size="lg" icon="play">Watch demo · 2 min</Button> |
| <div id="app"> | ||
| <div class="boot"><div class="boot-mark"></div></div> | ||
| </div> |
| {columns.map(c => <div key={c.key}>{c.label}</div>)} | ||
| </div> | ||
| {rows.map((row,i) => ( | ||
| <div key={i} onClick={() => onRowClick?.(row)} |
| Loaded from Google Fonts as stand-ins. See README substitution flag. | ||
| */ | ||
| @import url('https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500;600&display=swap'); |
| <p style={{ color:'var(--fg-2)', fontSize:16, lineHeight:1.6, marginBottom:20 }}> | ||
| Write your pipeline as a typed graph. Conductor handles retries, fan-out, cost caps, and routing. Run locally, push to prod, and get traces back for free. | ||
| </p> | ||
| <a href="#" style={{ color:accent, fontSize:14, fontFamily:'var(--font-mono)', textDecoration:'none' }}>Read the docs →</a> |
| ].map((c,i) => ( | ||
| <div key={i}> | ||
| <div style={{ fontFamily:'var(--font-mono)', fontSize:11, letterSpacing:'0.08em', textTransform:'uppercase', color:'var(--fg-3)', marginBottom:12 }}>{c.h}</div> | ||
| {c.items.map(x => <a key={x} href="#" style={{ display:'block', color:'var(--fg-2)', fontSize:13, textDecoration:'none', marginBottom:6 }}>{x}</a>)} |
| <link rel="canonical" href="https://genesis-conductor-site.iholt-mymail-aacc-edu.workers.dev/"> | ||
|
|
||
| <!-- Open Graph --> | ||
| <meta property="og:type" content="website"> | ||
| <meta property="og:site_name" content="Genesis Conductor"> | ||
| <meta property="og:title" content="Genesis Conductor — Orchestration for generative AI at production scale"> | ||
| <meta property="og:description" content="One control plane for every agent, job, and pipeline you run. Reproducible runs, fine-grained traces, replay from any step."> | ||
| <meta property="og:url" content="https://genesis-conductor-site.iholt-mymail-aacc-edu.workers.dev/"> |
Summary
public/public/index.htmlwith production React 18.3.1 builds (switched from dev builds in prototype)public/assets/conductorkit.css— full ConductorKit design token system (color, type, spacing)public/assets/barcelona-extropic.css— Barcelona-Extropic brand typography CSSpublic/components/— App, Marketing, Dashboard, Specimen, Shared JSX surface componentspublic/llms.txt— AI crawler content descriptionpublic/robots.txt— AI-crawler-friendly robots confignext.config.mjswith abeforeFilesrewrite so/servespublic/index.htmlon both local dev and Cloudflare WorkersTest plan
npm run dev— visithttp://localhost:3000and confirm the design prototype loads (Marketing surface by default)/assets/conductorkit.css,/assets/barcelona-extropic.css,/components/Marketing.jsxetc. are served correctlynpm run preview— confirm prototype runs in Cloudflareworkerdruntimehttps://genesis-conductor-site.iholt-mymail-aacc-edu.workers.dev/serves the designhttps://claude.ai/code/session_01LdEjAkTynFMmdQrVsFkgi6
Generated by Claude Code