Use peak-page mark as the favicon
Add a self-contained public/favicon.svg — the same peak-page mark with ink/clay colours and warm-paper background baked in (a browser tab can't apply the app stylesheet that colours the inline logo) — and link it from the home <head>. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_011SDkz6ft4rhf4WekytP8jc
diff --git a/lib/views/layout.rb b/lib/views/layout.rb
index 144e4fa..33d19c9 100644
--- a/lib/views/layout.rb
+++ b/lib/views/layout.rb
@@ -23,6 +23,7 @@ module Domus
meta(charset: "utf-8")
meta(name: "viewport", content: "width=device-width, initial-scale=1")
title { @title }
+ link(rel: "icon", type: "image/svg+xml", href: "/favicon.svg")
link(rel: "stylesheet", href: "/app.css")
@scripts.each { |src| script(defer: true, src:) }
script(defer: true, src: ALPINE)
diff --git a/public/favicon.svg b/public/favicon.svg
new file mode 100644
index 0000000..f927618
--- /dev/null
+++ b/public/favicon.svg
@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true">
+ <rect width="24" height="24" rx="5" fill="#f3efe6"/>
+ <g fill="none" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round">
+ <path stroke="#2a261f" d="M5 21 V9 L12 3.5 L19 9 V21 Z"/>
+ <line stroke="#9a5a3c" x1="8.5" y1="12.5" x2="15.5" y2="12.5"/>
+ <line stroke="#2a261f" x1="8.5" y1="15.5" x2="15.5" y2="15.5"/>
+ <line stroke="#2a261f" x1="8.5" y1="18.3" x2="13" y2="18.3"/>
+ </g>
+</svg>