feat: convert web El source to native HTML template syntax

Replace all return "..." HTML string literals with native El templates — removes all \" escapes, converts + interpolations to {expr}/{raw(expr)}, and replaces conditional string concatenation with {#if}/{#else}/{/if}. No functional changes; output is identical.
2026-05-05 05:18:01 -05:00
parent 1127dcd278
commit 5cb13d67f7
24 changed files with 1443 additions and 1494 deletions
@@ -165,24 +165,7 @@ fn page(sold: Int, total: Int) -> String {
    // Pricing is intentionally last so a visitor can scroll the whole story
    // (what / how / why / who-it's-for / safety / planet) before being asked
    // to commit to a plan.
-    return page_open()
-        + nav()
-        + hero()
-        + pillars()
-        + how_it_works()
-        + inference()
-        + efficiency()
-        + comparison()
-        + enterprise()
-        + mission()
-        + local_first()
-        + safety()
-        + environmental()
-        + marketplace()
-        + viral()
-        + pricing(sold, total)
-        + footer()
-        + page_close()
+    return {page_open()}{nav()}{hero()}{pillars()}{how_it_works()}{inference()}{efficiency()}{comparison()}{enterprise()}{mission()}{local_first()}{safety()}{environmental()}{marketplace()}{viral()}{pricing(sold, total)}{footer()}{page_close()}
 }

 // ── Share card page ───────────────────────────────────────────────────────────
@@ -210,23 +193,23 @@ fn share_card_page(question: String, answer_plain: String, answer_html_in: Strin
    // TikTok and Snapchat have no web URL share scheme — use clipboard copy
    let tiktok_copy_text: String = "Copied+%E2%80%94+paste+into+TikTok"
    let snap_copy_text: String = "Copied+%E2%80%94+paste+into+Snapchat"
-    return "<!DOCTYPE html>
-<html lang=\"en\">
+    return <!DOCTYPE html>
+<html lang="en">
 <head>
-<meta charset=\"UTF-8\">
-<meta name=\"viewport\" content=\"width=device-width,initial-scale=1\">
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width,initial-scale=1">
 <title>Things Neuron Said</title>
-<meta property=\"og:title\" content=\"Things Neuron Said\">
-<meta property=\"og:description\" content=\"" + og_desc + "\">
-<meta property=\"og:image\" content=\"https://neurontechnologies.ai/assets/brand/neuron-wordmark-on-light@2x.png\">
-<meta property=\"og:type\" content=\"website\">
-<meta property=\"og:url\" content=\"" + card_url + "\">
-<meta name=\"twitter:card\" content=\"summary_large_image\">
-<meta name=\"twitter:title\" content=\"Things Neuron Said\">
-<meta name=\"twitter:description\" content=\"" + og_desc + "\">
-<meta name=\"twitter:image\" content=\"https://neurontechnologies.ai/assets/brand/neuron-wordmark-on-light@2x.png\">
-<link rel=\"preconnect\" href=\"https://fonts.googleapis.com\">
-<link href=\"https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@300;400;500;600&display=swap\" rel=\"stylesheet\">
+<meta property="og:title" content="Things Neuron Said">
+<meta property="og:description" content="{og_desc}">
+<meta property="og:image" content="https://neurontechnologies.ai/assets/brand/neuron-wordmark-on-light@2x.png">
+<meta property="og:type" content="website">
+<meta property="og:url" content="{card_url}">
+<meta name="twitter:card" content="summary_large_image">
+<meta name="twitter:title" content="Things Neuron Said">
+<meta name="twitter:description" content="{og_desc}">
+<meta name="twitter:image" content="https://neurontechnologies.ai/assets/brand/neuron-wordmark-on-light@2x.png">
+<link rel="preconnect" href="https://fonts.googleapis.com">
+<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@300;400;500;600&display=swap" rel="stylesheet">
 <style>
 *,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
 :root{--navy:#0052A0;--navy-dark:#003d7a;--t1:#0D0D14;--t2:#3A3A4A;--t3:#6B6B7E;--bg:#FAFAF8}
@@ -280,70 +263,70 @@ body::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;bac
 </style>
 </head>
 <body>
-<div class=\"page\">
-  <div class=\"page-header\">
-    <a href=\"https://neurontechnologies.ai\" class=\"wordmark\">
-      <img src=\"/assets/brand/neuron-wordmark-on-light.png\"
-           srcset=\"/assets/brand/neuron-wordmark-on-light@2x.png 2x\"
-           alt=\"Neuron\" height=\"22\">
+<div class="page">
+  <div class="page-header">
+    <a href="https://neurontechnologies.ai" class="wordmark">
+      <img src="/assets/brand/neuron-wordmark-on-light.png"
+           srcset="/assets/brand/neuron-wordmark-on-light@2x.png 2x"
+           alt="Neuron" height="22">
    </a>
-    <span class=\"eyebrow\">Things Neuron Said</span>
+    <span class="eyebrow">Things Neuron Said</span>
  </div>

-  <div class=\"chat-frame\">
-    <div class=\"chat-row-user\">
-      <div class=\"bubble-user\">" + q_html + "</div>
+  <div class="chat-frame">
+    <div class="chat-row-user">
+      <div class="bubble-user">{raw(q_html)}</div>
    </div>
-    <div class=\"chat-row-ai\">
-      <div class=\"avatar\"><img src=\"/assets/neuron-icon.png\" alt=\"\"></div>
-      <div class=\"ai-col\">
-        <span class=\"ai-label\">Neuron</span>
-        <div class=\"bubble-ai\">" + a_html + "</div>
+    <div class="chat-row-ai">
+      <div class="avatar"><img src="/assets/neuron-icon.png" alt=""></div>
+      <div class="ai-col">
+        <span class="ai-label">Neuron</span>
+        <div class="bubble-ai">{raw(a_html)}</div>
      </div>
    </div>
  </div>

-  <div class=\"vote-row\">
-    <span class=\"vote-label\">Helpful?</span>
-    <button class=\"vote-btn\" id=\"vote-up\">&#9650;</button>
-    <span class=\"vote-count\" id=\"vote-score\">0</span>
-    <button class=\"vote-btn\" id=\"vote-down\">&#9660;</button>
+  <div class="vote-row">
+    <span class="vote-label">Helpful?</span>
+    <button class="vote-btn" id="vote-up">&#9650;</button>
+    <span class="vote-count" id="vote-score">0</span>
+    <button class="vote-btn" id="vote-down">&#9660;</button>
  </div>

-  <div class=\"share-section\">
-    <span class=\"share-label\">Share</span>
-    <div class=\"share-row\">
-      <a href=\"" + x_href + "\" target=\"_blank\" rel=\"noopener\" class=\"share-btn\" title=\"Post on X\" style=\"background:#000\">
-        <img src=\"/assets/social/x.svg\" width=\"18\" height=\"18\" alt=\"X\">
+  <div class="share-section">
+    <span class="share-label">Share</span>
+    <div class="share-row">
+      <a href="{x_href}" target="_blank" rel="noopener" class="share-btn" title="Post on X" style="background:#000">
+        <img src="/assets/social/x.svg" width="18" height="18" alt="X">
      </a>
-      <a href=\"" + li_href + "\" target=\"_blank\" rel=\"noopener\" class=\"share-btn\" title=\"Share on LinkedIn\" style=\"background:transparent\">
-        <img src=\"/assets/social/linkedin.png\" width=\"18\" height=\"18\" alt=\"LinkedIn\">
+      <a href="{li_href}" target="_blank" rel="noopener" class="share-btn" title="Share on LinkedIn" style="background:transparent">
+        <img src="/assets/social/linkedin.png" width="18" height="18" alt="LinkedIn">
      </a>
-      <a href=\"" + fb_href + "\" target=\"_blank\" rel=\"noopener\" class=\"share-btn\" title=\"Share on Facebook\" style=\"background:#1877F2\">
-        <img src=\"/assets/social/facebook.svg\" width=\"18\" height=\"18\" alt=\"Facebook\">
+      <a href="{fb_href}" target="_blank" rel="noopener" class="share-btn" title="Share on Facebook" style="background:#1877F2">
+        <img src="/assets/social/facebook.svg" width="18" height="18" alt="Facebook">
      </a>
-      <a href=\"" + wa_href + "\" target=\"_blank\" rel=\"noopener\" class=\"share-btn\" title=\"Send via WhatsApp\" style=\"background:#25D366\">
-        <img src=\"/assets/social/whatsapp.svg\" width=\"18\" height=\"18\" alt=\"WhatsApp\">
+      <a href="{wa_href}" target="_blank" rel="noopener" class="share-btn" title="Send via WhatsApp" style="background:#25D366">
+        <img src="/assets/social/whatsapp.svg" width="18" height="18" alt="WhatsApp">
      </a>
-      <button class=\"share-btn\" id=\"copy-tiktok\" onclick=\"copyForPlatform('tiktok', this)\" title=\"Copy for TikTok\" style=\"background:#010101;border:none\">
-        <img src=\"/assets/social/tiktok.svg\" width=\"18\" height=\"18\" alt=\"TikTok\">
+      <button class="share-btn" id="copy-tiktok" onclick="copyForPlatform('tiktok', this)" title="Copy for TikTok" style="background:#010101;border:none">
+        <img src="/assets/social/tiktok.svg" width="18" height="18" alt="TikTok">
      </button>
-      <button class=\"share-btn\" id=\"copy-snapchat\" onclick=\"copyForPlatform('snapchat', this)\" title=\"Copy for Snapchat\" style=\"background:#FFFC00;border:none\">
-        <img src=\"/assets/social/snapchat.svg\" width=\"18\" height=\"18\" alt=\"Snapchat\">
+      <button class="share-btn" id="copy-snapchat" onclick="copyForPlatform('snapchat', this)" title="Copy for Snapchat" style="background:#FFFC00;border:none">
+        <img src="/assets/social/snapchat.svg" width="18" height="18" alt="Snapchat">
      </button>
    </div>
  </div>

-  <div class=\"divider\"></div>
+  <div class="divider"></div>

-  <div class=\"footer-row\">
-    <span class=\"footer-note\">From a live conversation with Neuron.</span>
-    <a href=\"https://neurontechnologies.ai\" class=\"cta-btn\">Try Neuron &#8599;</a>
+  <div class="footer-row">
+    <span class="footer-note">From a live conversation with Neuron.</span>
+    <a href="https://neurontechnologies.ai" class="cta-btn">Try Neuron &#8599;</a>
  </div>
 </div>
-<script>window.NEURON_CFG=window.NEURON_CFG||{};window.NEURON_CFG.id=\"" + id + "\";window.NEURON_CFG.card_url=\"" + card_url + "\";</script><script src=\"/js/main.js\" defer></script>
+<script>window.NEURON_CFG=window.NEURON_CFG||{};window.NEURON_CFG.id="{id}";window.NEURON_CFG.card_url="{card_url}";</script><script src="/js/main.js" defer></script>
 </body>
-</html>"
+</html>
 }

 // ── Static asset serving ──────────────────────────────────────────────────────