_shell template: theme toggle (sun/moon, fixed top-right) + light CSS vars; FIX leftover 'Commerce Claw' brand string in topbar → 'VenturaClaw' (caught by /pricing audit); add /services to topbar nav

b1dd0582daa307eea6608c706a7180780cd11b04 · 2026-05-07 10:08:54 -0700 · Steve
Files touched

M server/server.js
Diff

commit b1dd0582daa307eea6608c706a7180780cd11b04
Author: Steve <steve@designerwallcoverings.com>
Date:   Thu May 7 10:08:54 2026 -0700

    _shell template: theme toggle (sun/moon, fixed top-right) + light CSS vars; FIX leftover 'Commerce Claw' brand string in topbar → 'VenturaClaw' (caught by /pricing audit); add /services to topbar nav
---
 server/server.js | 28 ++++++++++++++++++++++++++--
 1 file changed, 26 insertions(+), 2 deletions(-)

diff --git a/server/server.js b/server/server.js
index 563cc54..a7de531 100644
--- a/server/server.js
+++ b/server/server.js
@@ -1136,9 +1136,30 @@ function _shell({ title, desc, canonical, body, jsonLd }) {
 <meta property="og:url" content="${esc(canonical)}"><meta property="og:type" content="website">
 <meta property="og:image" content="https://${DOMAIN}/static/og-cover.svg">
 <meta name="twitter:card" content="summary_large_image">
+<script>(function(){try{if(localStorage.getItem('vc-theme')==='light')document.documentElement.setAttribute('data-theme','light');}catch(e){}})();</script>
 ${ldBlock}
 <link rel="stylesheet" href="/static/style.css">
 <style>
+html[data-theme="light"] {
+  --bg: #faf8f3; --bg-elevated: #f1ece1;
+  --rule: #d6cfbd; --rule-2: #c3b9a2;
+  --ink: #1a1a1a; --ink-soft: #383530; --ink-mute: #6a655a;
+  --gold: #8a6520;
+}
+html, body { transition: background-color 200ms ease, color 200ms ease; }
+.theme-toggle {
+  position: fixed; top: 18px; right: 18px; z-index: 100;
+  background: var(--bg-elevated); color: var(--ink-mute); border: 1px solid var(--rule);
+  width: 32px; height: 32px; border-radius: 50%; cursor: pointer;
+  display: inline-flex; align-items: center; justify-content: center;
+  font-size: 14px; line-height: 1; padding: 0;
+  transition: all 200ms;
+}
+.theme-toggle:hover { color: var(--gold); border-color: var(--gold); transform: rotate(20deg); }
+.theme-toggle .moon { display: inline; }
+.theme-toggle .sun  { display: none; }
+html[data-theme="light"] .theme-toggle .moon { display: none; }
+html[data-theme="light"] .theme-toggle .sun  { display: inline; }
 .page { max-width: 1080px; margin: 0 auto; padding: 60px 28px; }
 .page-narrow { max-width: 760px; }
 .eyebrow { font-family: var(--mono); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--gold); margin-bottom: 14px; }
@@ -1166,13 +1187,16 @@ h2 { font-family: var(--serif); font-weight: 500; font-size: 26px; margin: 40px
 <header class="topbar" style="max-width:1180px;margin:0 auto;padding:18px 28px;display:flex;justify-content:space-between;align-items:center">
   <a href="/" style="text-decoration:none;display:flex;gap:12px;align-items:center">
     <div class="logo-dot"></div>
-    <div class="brand-name" style="font-family:var(--serif);font-size:18px;font-weight:500;color:var(--ink)">Commerce <em style="font-style:italic;color:var(--gold)">Claw</em></div>
+    <div class="brand-name" style="font-family:var(--serif);font-size:18px;font-weight:500;color:var(--ink)">Ventura<em style="font-style:italic;color:var(--gold)">Claw</em></div>
   </a>
-  <nav style="display:flex;gap:18px;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase">
+  <nav style="display:flex;gap:18px;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;align-items:center">
+    <a href="/services" style="color:var(--ink-soft);text-decoration:none">Services</a>
     <a href="/connectors" style="color:var(--ink-soft);text-decoration:none">Connectors</a>
     <a href="/login" style="color:var(--gold);border:1px solid var(--gold);padding:8px 16px;border-radius:2px;text-decoration:none">Sign in</a>
   </nav>
 </header>
+<button class="theme-toggle" id="themeToggle" type="button" title="Toggle light/dark" aria-label="Toggle theme"><span class="moon">☾</span><span class="sun">☀︎</span></button>
+<script>document.getElementById('themeToggle').addEventListener('click',()=>{const c=document.documentElement.getAttribute('data-theme')==='light'?'light':'dark';const n=c==='light'?'dark':'light';if(n==='light')document.documentElement.setAttribute('data-theme','light');else document.documentElement.removeAttribute('data-theme');try{localStorage.setItem('vc-theme',n);}catch{}});</script>
 ${body}
 <footer style="max-width:1180px;margin:60px auto 0;padding:28px;border-top:1px solid var(--rule);font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mute);display:flex;justify-content:space-between;flex-wrap:wrap;gap:18px">
   <span>VenturaClaw · ${esc(DOMAIN)}</span>
← 7151c1c teaser footer: add /connectors + /docs links (alongside /ser · back to Ventura Claw · /changelog 2026-05-07: append 4 continued-sweep wins (Last-M a3250a8 →