metronome/src/header.html
Me Here be00ebf097 Restructure (1/2): Concepts = landing with live embeds; shared chrome partials; Showcase redesign
- Concepts is now the landing (/): index.html is the form-factor gallery with the
  LIVE widget embedded in every box (editor/teacher/stage/micro/showcase/initial),
  on the shared header/footer. concepts.html retired; every "Concepts" link → /.
- New shared chrome partials src/header.html, src/footer.html, src/chrome.js
  (assembled by build.sh) + .site-foot / details.spec styles in base.css. Applied
  to the landing + showcase this pass.
- Showcase redesign per spec: the pendulum bar IS the display — each lane's
  subdivisions/accents ride along the rod as moving RGB light (all meters combined);
  transparent outside the body (no black window); a printed tempo scale on the
  vertical axis with a draggable weight to set tempo; start is an external button
  (the real unit starts when lifted from its holder).

Next pass: roll the shared header/footer onto the remaining pages (incl. the editor
header-above-toolbar), merge Open=Info into one page per form factor with the
expandable Info & BOM, and add teacher-style dimensioned views to Stage/Micro/Showcase.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-28 09:09:51 -05:00

14 lines
758 B
HTML

<!-- Shared site header — assembled into every page by build.sh.
Brand goes to Concepts (the landing); nav: Concepts / Editor / Embed / Theme. -->
<header class="site-head">
<a class="brand" href="/" title="VARASYS PolyMeter — Concepts (home)">
<img class="brand-logo brand-dark" src="data:image/png;base64,@BUILD:logo-dark@" alt="VARASYS — Simplifying Complexity" />
<img class="brand-logo brand-light" src="data:image/png;base64,@BUILD:logo-light@" alt="VARASYS — Simplifying Complexity" />
</a>
<nav class="site-nav">
<a href="/">Concepts</a>
<a href="/editor.html">Editor</a>
<a href="/embed.html">Embed</a>
<button id="themeBtn" class="tbtn" title="toggle light / dark theme"></button>
</nav>
</header>