/* Shared partials v3: brand mark, header, mobile drawer, footer, dashboard mock, headshot slot */ /* Cookie and analytics scripts are intentionally omitted in this local trial-page copy. */ window.BrandMark = function BrandMark({ size = 28, light = false }) { const c1 = light ? '#fff' : '#00204D'; const c2 = '#0065E3'; const c3 = '#6BA5F0'; return ( ); }; window.GitHubIcon = function GitHubIcon({ size = 18 }) { return ( ); }; window.SiteHeader = function SiteHeader({ active = 'home' }) { const [open, setOpen] = React.useState(false); const items = [ { id: 'home', label: 'Home', href: 'index.html' }, { id: 'elements', label: 'Elements', href: 'elements.html' }, { id: 'foundation', label: 'Foundation', href: 'foundation.html' }, { id: 'participate', label: 'Participate', href: 'participate.html' }, ]; React.useEffect(() => { document.body.classList.toggle('no-scroll', open); return () => document.body.classList.remove('no-scroll'); }, [open]); return (
Constructor Fabric
GitHub
Constructor Fabric
GitHub
); }; window.SiteFooter = function SiteFooter() { return ( ); }; /* Constructor Insight dashboard — blue palette only */ window.InsightDashboard = function InsightDashboard({ compact = false }) { return (
Delivery health › Last 30 days
{['1d','7d','30d','90d'].map((p,i)=>( {p} ))}
+ New view
{[ ['Lead time','3.4d', '−18%'], ['Deploy freq','12.6/d','+22%'], ['Change fail','3.1%','−0.4pt'], ['MTTR','27m','+4m'], ].map(([l,v,d], i)=>(
{l}
{v}
{d}
))}
Delivery flow
Plan → Build → Run, last 30 days
Plan Build Run
{[40,80,120,160].map(y=>())}
Active streams
{[ ['BSS / billing', 84], ['Edge runtime', 62], ['Identity svc', 91], ['Tenant migration', 34], ['Insight reporting', 76], ].map(([n,p], i)=>(
{n}{p}%
))}
Recent runs
{[ ['main · #4218', 'pass', '2m'], ['feat/quota · #4217','pass','9m'], ['hotfix/auth · #4216','warn','22m'], ['main · #4215','pass','1h'], ['rel/2026.5 · #4214','pass','3h'], ].map(([n,s,t],i)=>(
{n}
{t}
))}
); }; /* SDLC cycle diagram — blue palette */ window.SDLCDiagram = function SDLCDiagram() { const stages = [ { l: 'Plan', a: -90 }, { l: 'Design', a: -30 }, { l: 'Build', a: 30 }, { l: 'Test', a: 90 }, { l: 'Release', a: 150 }, { l: 'Operate', a: 210 }, ]; const r = 150, cx = 220, cy = 220; return ( {[0,60,120,180,240,300].map(a=>{ const rad = (a-90)*Math.PI/180; const x = cx + Math.cos(rad)*r; const y = cy + Math.sin(rad)*r; return ; })} Constructor Fabric {stages.map((s,i)=>{ const rad = s.a*Math.PI/180; const x = cx + Math.cos(rad)*r; const y = cy + Math.sin(rad)*r; return ( {s.l} ); })} REQUIREMENTS PRODUCTION ); }; /* Team headshot card with circular IMG slot wired to a real src path */ window.TeamCard = function TeamCard({ name, role, bio, src, github, imgStyle }) { const initials = name.split(' ').map(s => s[0]).slice(0,2).join('').toUpperCase(); const [errored, setErrored] = React.useState(false); return (
{!errored ? ( {name} setErrored(true)}/> ) : (
{initials}
)}
{name}
{role}
{bio ?

{bio}

: null} {github ? ( GitHub ) : null}
); }; /* Shared CTA — appears at the bottom of every page */ window.ConstructorFabricCycle = function ConstructorFabricCycle() { return ( Constructor Fabric — connected SDLC cycle Seven-node ring for the software development lifecycle with every pair of nodes connected by primary-blue threads, representing the woven fabric across requirements, UX, design, code, test, deployment, and production. {/* Outer ring */} {/* Cross threads — fabric texture */} {/* Adjacent ring threads */} {/* Nodes */} Requirements UX Design Code Test Deploy Prod {/* Center pill */} CONSTRUCTOR FABRIC SDLC Cycle ); }; window.CtaStart = function CtaStart() { return (

Start now

Use · Contribute · Become a Member

); };