ux: chat header + greeting + brain avatar + share button + terms + badge
Restores inline-JS styles.el (the obfuscated /assets/js/*.js path
broke the chat widget) and threads four UX fixes through it:
- Chat header: drop the all-caps "NEURON / Live Demo" subtitle, keep
just "Neuron" in bold white at 1rem.
- Greeting: replace the canned "Hi. I am Neuron. You get 5 questions"
with "Hey. What is on your mind?" in all three callsites (open,
reset, turnstile-verified). The questions counter is already in
the header, so we don't need to repeat it.
- Avatar: switch chat avatar from neuron-icon.png to the brain mark
(/assets/brand/neuron-brain.png). Thinking state now shows the
pulsing brain plus three-dot animation instead of "thinking..."
text.
- Share button: from a muted t3 link to a navy pill with subtle
background, uppercase letter-spacing, and active-press feedback.
main.el: drop the FOUNDING_SOLD = 47 floor and rewrite
fetch_founding_count_stripe to count succeeded PaymentIntents (the
live Stripe Elements path) AND legacy Checkout Sessions, excluding
refunded charges.
founding_badge.el: rewrite to the Option C "Tag" design picked from
/tmp/founding-badge-preview.html - tall card, navy top stroke, brain
mark prominent, "Neuron, LLC" footer.
terms.el: kill the "Neuron Inference - our own inference layer, live
now" claim. Inference launches Q3 2026 and the wording now says so.
This commit is contained in:
Will Anderson
+81
-33
@@ -1519,19 +1519,13 @@ fn page_open() -> String {
|
||||
}
|
||||
#neuron-demo-header span {
|
||||
font-family: var(--body);
|
||||
font-size: 0.75rem;
|
||||
font-weight: 500;
|
||||
letter-spacing: 0.12em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
#neuron-demo-header-sub {
|
||||
font-family: var(--body);
|
||||
font-size: 0.625rem;
|
||||
letter-spacing: 0.08em;
|
||||
color: rgba(255,255,255,.85);
|
||||
text-transform: uppercase;
|
||||
margin-top: 0.1rem;
|
||||
font-size: 1rem;
|
||||
font-weight: 700;
|
||||
color: #fff;
|
||||
letter-spacing: 0;
|
||||
text-transform: none;
|
||||
}
|
||||
#neuron-demo-header-sub { display: none; }
|
||||
#neuron-demo-close {
|
||||
background: none;
|
||||
border: none;
|
||||
@@ -1666,29 +1660,66 @@ fn page_open() -> String {
|
||||
.demo-msg-thinking {
|
||||
align-self: flex-start;
|
||||
color: var(--t3);
|
||||
font-size: 0.75rem;
|
||||
letter-spacing: 0.08em;
|
||||
font-style: italic;
|
||||
font-size: 0.8rem;
|
||||
letter-spacing: 0.04em;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.625rem;
|
||||
padding: 0.25rem 0;
|
||||
}
|
||||
.demo-msg-thinking .demo-msg-avatar {
|
||||
width: 1.75rem;
|
||||
height: 1.75rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.demo-msg-thinking .demo-msg-avatar img {
|
||||
width: 1.125rem;
|
||||
height: 1.125rem;
|
||||
animation: brainPulse 1.4s ease-in-out infinite;
|
||||
}
|
||||
.demo-msg-thinking-dots { display: inline-flex; gap: 3px; }
|
||||
.demo-msg-thinking-dots span {
|
||||
width: 5px; height: 5px; border-radius: 50%;
|
||||
background: rgba(0,82,160,0.55);
|
||||
animation: thinkDot 1.2s ease-in-out infinite;
|
||||
}
|
||||
.demo-msg-thinking-dots span:nth-child(2) { animation-delay: 0.15s; }
|
||||
.demo-msg-thinking-dots span:nth-child(3) { animation-delay: 0.3s; }
|
||||
@keyframes thinkDot {
|
||||
0%, 80%, 100% { opacity: 0.25; transform: scale(0.85); }
|
||||
40% { opacity: 1; transform: scale(1); }
|
||||
}
|
||||
@keyframes brainPulse {
|
||||
0%, 100% { opacity: 0.55; transform: scale(0.92); }
|
||||
50% { opacity: 1; transform: scale(1.05); }
|
||||
}
|
||||
.demo-share-pill {
|
||||
background: none;
|
||||
border: none;
|
||||
color: var(--t3);
|
||||
background: rgba(0,82,160,0.07);
|
||||
border: 1px solid rgba(0,82,160,0.22);
|
||||
color: var(--navy);
|
||||
cursor: pointer;
|
||||
padding: 0.2rem 0;
|
||||
padding: 0.4rem 0.75rem;
|
||||
font-family: var(--body);
|
||||
font-size: 0.7rem;
|
||||
font-weight: 400;
|
||||
letter-spacing: 0.04em;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.08em;
|
||||
text-transform: uppercase;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.25rem;
|
||||
margin-top: 0.3rem;
|
||||
gap: 0.4rem;
|
||||
margin-top: 0.5rem;
|
||||
margin-left: 2.5rem;
|
||||
align-self: flex-start;
|
||||
transition: color 0.15s;
|
||||
transition: background 0.15s, border-color 0.15s, transform 0.1s;
|
||||
line-height: 1;
|
||||
border-radius: 6px;
|
||||
}
|
||||
.demo-share-pill:hover { color: var(--navy); }
|
||||
.demo-share-pill:hover {
|
||||
background: rgba(0,82,160,0.14);
|
||||
border-color: rgba(0,82,160,0.45);
|
||||
}
|
||||
.demo-share-pill:active { transform: scale(0.97); }
|
||||
.demo-share-pill svg { width: 11px; height: 11px; }
|
||||
|
||||
#neuron-demo-input-row {
|
||||
display: flex;
|
||||
@@ -1993,7 +2024,7 @@ fn page_close() -> String {
|
||||
<!-- ── Neuron Demo Chat Widget ──────────────────────────────────────────────── -->
|
||||
<div id=\"neuron-demo-btn\">
|
||||
<button onclick=\"neuronDemoToggle()\" aria-label=\"Chat with Neuron\">
|
||||
<img src=\"/assets/neuron-icon.png\" alt=\"\">
|
||||
<img src=\"/assets/brand/neuron-brain.png\" alt=\"\">
|
||||
Try Neuron
|
||||
</button>
|
||||
</div>
|
||||
@@ -2001,7 +2032,7 @@ fn page_close() -> String {
|
||||
<div id=\"neuron-demo-panel\" style=\"display:none\">
|
||||
<div id=\"neuron-demo-header\">
|
||||
<div id=\"neuron-demo-header-left\">
|
||||
<img src=\"/assets/neuron-icon.png\" alt=\"Neuron\">
|
||||
<img src=\"/assets/brand/neuron-brain.png\" alt=\"Neuron\">
|
||||
<div>
|
||||
<span>Neuron</span>
|
||||
<div id=\"neuron-demo-header-sub\">Live Demo</div>
|
||||
@@ -2118,7 +2149,7 @@ fn page_close() -> String {
|
||||
if (input) { input.disabled = false; input.placeholder = 'Ask me anything...'; }
|
||||
var btn = document.getElementById('neuron-demo-send');
|
||||
if (btn) btn.disabled = false;
|
||||
addMsg('ai', 'Hi. I am Neuron. You get 5 questions.', true);
|
||||
addMsg('ai', 'Hey. What is on your mind?', true);
|
||||
};
|
||||
|
||||
window.neuronDemoToggle = function() {
|
||||
@@ -2139,7 +2170,7 @@ fn page_close() -> String {
|
||||
if (input) { input.disabled = true; input.placeholder = 'Interaction limit reached'; }
|
||||
}
|
||||
} else {
|
||||
addMsg('ai', 'Hi. I am Neuron. You get 5 questions.', true);
|
||||
addMsg('ai', 'Hey. What is on your mind?', true);
|
||||
}
|
||||
}
|
||||
var input = document.getElementById('neuron-demo-text');
|
||||
@@ -2168,7 +2199,7 @@ fn page_close() -> String {
|
||||
if (msgs) msgs.style.display = 'flex';
|
||||
if (inputRow) inputRow.style.display = 'flex';
|
||||
// Show opening message
|
||||
addMsg('ai', 'Hi. I am Neuron. You get 5 questions.', true);
|
||||
addMsg('ai', 'Hey. What is on your mind?', true);
|
||||
updateCountdown();
|
||||
var inp = document.getElementById('neuron-demo-text');
|
||||
if (inp) inp.focus();
|
||||
@@ -2192,7 +2223,7 @@ fn page_close() -> String {
|
||||
avatar.className = 'demo-msg-avatar';
|
||||
if (role === 'ai') {
|
||||
var img = document.createElement('img');
|
||||
img.src = '/assets/neuron-icon.png';
|
||||
img.src = '/assets/brand/neuron-brain.png';
|
||||
img.alt = 'Neuron';
|
||||
avatar.appendChild(img);
|
||||
} else {
|
||||
@@ -2275,8 +2306,25 @@ fn page_close() -> String {
|
||||
input.value = '';
|
||||
btn.disabled = true;
|
||||
addMsg('user', msg);
|
||||
var thinking = addMsg('thinking', 'thinking...');
|
||||
if (thinking) thinking.className = 'demo-msg demo-msg-thinking';
|
||||
// Thinking indicator with brain avatar + animated dots
|
||||
var thinking = document.createElement('div');
|
||||
thinking.className = 'demo-msg demo-msg-thinking';
|
||||
var thAvatar = document.createElement('div');
|
||||
thAvatar.className = 'demo-msg-avatar';
|
||||
var thImg = document.createElement('img');
|
||||
thImg.src = '/assets/brand/neuron-brain.png';
|
||||
thImg.alt = 'Neuron';
|
||||
thAvatar.appendChild(thImg);
|
||||
thinking.appendChild(thAvatar);
|
||||
var thDots = document.createElement('span');
|
||||
thDots.className = 'demo-msg-thinking-dots';
|
||||
thDots.innerHTML = '<span></span><span></span><span></span>';
|
||||
thinking.appendChild(thDots);
|
||||
var thMsgsEl = document.getElementById('neuron-demo-messages');
|
||||
if (thMsgsEl) {
|
||||
thMsgsEl.appendChild(thinking);
|
||||
thMsgsEl.scrollTop = thMsgsEl.scrollHeight;
|
||||
}
|
||||
if (turnstileVerified && !session._cfSent) { session._cfSent = true; }
|
||||
try {
|
||||
// Build history from session for soul context
|
||||
|
||||
Reference in New Issue
Block a user