Operator.astro (3339B)
1 --- 2 interface Props { 3 sheets: number; 4 domains: number; 5 mirrors: number; 6 updated: string; 7 } 8 const { sheets, domains, mirrors, updated } = Astro.props; 9 10 /** 11 * The operator band — a dark plate with a grid texture, capability chips, a 12 * terminal `--status` readout and an action rail, ported from the main site's 13 * operator section. The rail's search field opens the Pagefind modal 14 * (`[data-search-open]`, bound in SearchModal); the stats and CTAs bind the 15 * real vault counts. 16 */ 17 const pad2 = (n: number) => String(n).padStart(2, '0'); 18 --- 19 <section class="operator bleed" aria-labelledby="op-title"> 20 <div class="operator__grid" aria-hidden="true"></div> 21 <div class="archive operator__inner"> 22 <div class="sec-head"> 23 <span class="sec-head__eyebrow" style="--tone: var(--color-night-iris);">Index / operator</span> 24 <h2 id="op-title" class="sec-head__title" style="--tone: var(--color-night-iris);">Start here.</h2> 25 <p class="sec-head__intro" style="--intro: var(--color-signal-meta);"> 26 {sheets} sheets across {domains} shelves, plus two full upstream mirrors. The shelves are 27 below; the index itself runs under them. 28 </p> 29 </div> 30 31 <div class="operator__cols"> 32 <div> 33 <div class="op-chips"> 34 <span class="op-chip" style="--chip: var(--color-night-iris);"><span class="pip dmn-anim-pulse"></span>Offline search</span> 35 <span class="op-chip" style="--chip: var(--color-night-foam);">Copy-ready</span> 36 <span class="op-chip" style="--chip: var(--color-night-love);">Zero fluff</span> 37 </div> 38 <div class="op-readout"> 39 <div class="op-readout__cmd"> 40 <span class="u">daemon@ref</span><span>~</span><span>%</span><span class="c">vault --status</span><span class="dmn-blink"></span> 41 </div> 42 <dl> 43 <dt>sheets</dt><dd>{sheets} · curated</dd> 44 <dt>shelves</dt><dd>{domains} · domains</dd> 45 <dt>search</dt><dd><span class="on">offline</span> · fuzzy · no tracking</dd> 46 <dt>updated</dt><dd>{updated}</dd> 47 </dl> 48 </div> 49 </div> 50 51 <div class="op-rail"> 52 <div class="op-rail__eyebrow">Quick search / 2026</div> 53 <button class="op-search" data-search-open type="button" aria-label="Search the vault"> 54 <span class="slash">/</span> 55 <span class="ph">search the vault</span> 56 <kbd>⌘K</kbd> 57 </button> 58 <dl class="op-stats"> 59 <dd><span style="color: var(--color-night-iris);">{pad2(domains)}</span> shelves</dd> 60 <dd><span style="color: var(--color-night-love);">{sheets}</span> sheets</dd> 61 <dd><span style="color: var(--color-night-gold);">{pad2(mirrors)}</span> mirrors</dd> 62 </dl> 63 <div class="op-cta-list"> 64 <a class="op-cta op-cta--pine" href="#index"><span>Open the index</span><span class="count">{sheets} sheets</span><span>↓</span></a> 65 <a class="op-cta op-cta--text" href="#shelves"><span>Pick a shelf</span><span class="count">{pad2(domains)} shelves</span><span>↓</span></a> 66 <a class="op-cta op-cta--love" href="#mirrors"><span>Mirrored trees</span><span class="count">{pad2(mirrors)} upstream</span><span>↓</span></a> 67 </div> 68 </div> 69 </div> 70 </div> 71 </section>