From 920bb7bbeba92d2c8a81aa1390dd691a39dcb6a9 Mon Sep 17 00:00:00 2001
From: lew <lew@ily.rs>
Date: Fri, 23 Jan 2026 05:23:01 +0000
Subject: [PATCH] feat: tweaks to guestbook messages after port

---
 apps/blog/src/pages/index.astro | 14 +++++++++-----
 apps/blog/src/styles/global.css | 20 ++++++++++++++++++++
 2 files changed, 29 insertions(+), 5 deletions(-)

diff --git a/apps/blog/src/pages/index.astro b/apps/blog/src/pages/index.astro
index c99b059..ad3566c 100644
--- a/apps/blog/src/pages/index.astro
+++ b/apps/blog/src/pages/index.astro
@@ -89,11 +89,15 @@ function extractDomain(url: string): string {
 
 <details open>
   <summary>guestbook</summary>
-<pre set:html={[
-  ...guestbookEntries.map(e => `<span class="muted">${formatDate(e.createdAt)}</span>    ${e.url ? `<a href="${e.url}">${e.name}</a>` : e.name}: ${e.message}`),
-  '',
-  '<a href="#" id="sign-guestbook">sign</a><span id="guestbook-status"></span>'
-].join('\n')} />
+  <div class="guestbook-entries">
+    {guestbookEntries.map(e => (
+      <div class="guestbook-entry">
+        <span class="date">{formatDate(e.createdAt)}</span>
+        <span set:html={`${e.url ? `<a href="${e.url}">${e.name}</a>` : e.name}: ${e.message}`} />
+      </div>
+    ))}
+  </div>
+  <pre class="guestbook-sign"><a href="#" id="sign-guestbook">sign</a><span id="guestbook-status"></span></pre>
 </details>
 
 <script>
diff --git a/apps/blog/src/styles/global.css b/apps/blog/src/styles/global.css
index b919912..545a5c0 100644
--- a/apps/blog/src/styles/global.css
+++ b/apps/blog/src/styles/global.css
@@ -46,3 +46,23 @@ summary::-webkit-details-marker {
 details pre {
   margin: 0;
 }
+
+.guestbook-entries {
+  font-family: monospace;
+  white-space: pre-wrap;
+}
+
+.guestbook-entry {
+  display: grid;
+  grid-template-columns: auto 1fr;
+  gap: 0 4ch;
+}
+
+.guestbook-entry .date {
+  color: #888;
+}
+
+.guestbook-sign {
+  font-family: monospace;
+  white-space: pre;
+}