Replace the three-layer cssx system (macro + value functions + class components) with a single token resolver. Tokens like "bg-yellow-199", "hover:bg-rose-500", "md:text-xl" are parsed into CSS declarations. Two delivery mechanisms, same token format: - tw() function: returns inline style string for :style - ~cssx/tw macro: injects JIT class + <style> onto first child element The resolver handles: colours (21 names, any shade 0-950), spacing, typography, display, max-width, rounded, opacity, w/h, gap, text decoration, cursor, overflow, transitions. States (hover/focus/active) and responsive breakpoints (sm/md/lg/xl/2xl) for class-based usage. Next step: replace macro/function approach with spec-level primitives (defcontext/provide/context + spread) so ~cssx/tw becomes a proper component returning spread values, with rules collected via context. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
20 lines
713 B
Plaintext
20 lines
713 B
Plaintext
;; 404 Not Found page content
|
|
|
|
(defcomp ~not-found/content (&key (path :as string?))
|
|
(div :class "max-w-3xl mx-auto px-4 py-12 text-center"
|
|
(h1 :style (tw "text-stone-800 text-3xl font-bold")
|
|
"404")
|
|
(p :class "mt-4"
|
|
:style (tw "text-stone-500 text-lg")
|
|
"Page not found")
|
|
(when path
|
|
(p :class "mt-2"
|
|
:style (tw "text-stone-400 text-sm font-mono")
|
|
path))
|
|
(a :href "/sx/"
|
|
:sx-get "/sx/" :sx-target "#main-panel" :sx-select "#main-panel"
|
|
:sx-swap "outerHTML" :sx-push-url "true"
|
|
:class "inline-block mt-6 px-4 py-2 rounded border transition-colors"
|
|
:style (tw "text-violet-700 text-sm border-violet-200")
|
|
"Back to home")))
|