mirror of
https://github.com/karpathy/nanochat.git
synced 2026-05-09 01:10:10 +00:00
634be4080b
Build services/frontend/ replacing the legacy nanochat/ui.html single-file UI. Landing, login, and chat pages ported with full design system: Devanagari + Great Vibes hero, samosa/chai/toran SVG animations, gold/cream palette. - App Router pages: / (hero + floating illustrations), /login (split-screen OAuth with mandala motif), /chat (260px collapsible sidebar, suggestion chips, markdown + code-copy, auto-expanding input, slash commands) - SSE streaming via useSSE hook and /api/chat/stream BFF route (proxies to CHAT_API_URL when set, falls back to mock echo for local dev) - NextAuth.js v5 with Google + GitHub providers; middleware gates /chat/* - Zustand store with localStorage persistence for conversations/settings - Tailwind theme carries all ui.html tokens + keyframes (pendulum, float, wobble, steamFloat, steamType); SVG assets componentized under components/svg - Multi-stage node:20-alpine Dockerfile with Next standalone output Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
51 lines
1.6 KiB
CSS
51 lines
1.6 KiB
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
:root {
|
|
color-scheme: light;
|
|
--gold: #e8a838;
|
|
--brown: #8b4d0a;
|
|
--cream: #fff8e7;
|
|
--green-chutney: #2d8a4e;
|
|
--red-chutney: #c0392b;
|
|
--warm-grey: #d4c4a0;
|
|
--light-cream: #fffdf5;
|
|
}
|
|
|
|
html, body { height: 100%; }
|
|
|
|
body {
|
|
@apply font-sans bg-white text-gray-900;
|
|
min-height: 100dvh;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
/* Markdown prose tweaks inside message bubbles */
|
|
.markdown-body > *:first-child { margin-top: 0 !important; }
|
|
.markdown-body > *:last-child { margin-bottom: 0 !important; }
|
|
.markdown-body pre {
|
|
@apply bg-slate-900 text-slate-50 rounded-lg p-4 overflow-x-auto my-2 text-sm;
|
|
}
|
|
.markdown-body code:not(pre code) {
|
|
@apply px-1 py-0.5 rounded bg-cream-light border border-cream-border text-brown text-[0.9em];
|
|
}
|
|
.markdown-body p { @apply my-2 leading-relaxed; }
|
|
.markdown-body ul { @apply list-disc pl-6 my-2; }
|
|
.markdown-body ol { @apply list-decimal pl-6 my-2; }
|
|
.markdown-body h1 { @apply text-xl font-bold mt-4 mb-2; }
|
|
.markdown-body h2 { @apply text-lg font-bold mt-3 mb-2; }
|
|
.markdown-body h3 { @apply text-base font-bold mt-2 mb-1; }
|
|
.markdown-body blockquote {
|
|
@apply border-l-4 border-cream-border pl-4 italic text-brown-light my-2;
|
|
}
|
|
.markdown-body a { @apply text-chutney-green underline hover:text-gold; }
|
|
|
|
/* Scrollbar tuning */
|
|
.nice-scrollbar::-webkit-scrollbar { width: 6px; height: 6px; }
|
|
.nice-scrollbar::-webkit-scrollbar-thumb { background: #e0d5c0; border-radius: 3px; }
|
|
.nice-scrollbar::-webkit-scrollbar-thumb:hover { background: var(--warm-grey); }
|
|
|
|
/* Highlight.js minimal tweaks */
|
|
.hljs { background: transparent; }
|