fix: guestbook alignment tweak so comments don't overflow their column

This commit is contained in:
Lewis Wynne 2026-03-26 15:46:41 +00:00
parent 2d89945692
commit 99d80f56b7
3 changed files with 7 additions and 4 deletions

View file

@ -1,3 +1,2 @@
pinned: pinned:
- now.txt - none
- cv.txt

View file

@ -59,8 +59,8 @@ const urls = [
<pre class="guestbook-entries" set:html={guestbookEntries.map((e, i) => { <pre class="guestbook-entries" set:html={guestbookEntries.map((e, i) => {
const prefix = i === 0 ? labelPrefix(SECTIONS.guestbook, `?just=${SECTIONS.guestbook}`) : blankPrefix; const prefix = i === 0 ? labelPrefix(SECTIONS.guestbook, `?just=${SECTIONS.guestbook}`) : blankPrefix;
const nameHtml = e.url ? `<a href="${e.url}"><b>${e.name}</b></a>` : `<b>${e.name}</b>`; const nameHtml = e.url ? `<a href="${e.url}"><b>${e.name}</b></a>` : `<b>${e.name}</b>`;
return `${prefix}<span class="muted">${formatDate(e.createdAt)}</span> ${nameHtml} ${e.message}`; return `<span class="guestbook-entry" style="padding-left: ${labelWidth + 12}ch; text-indent: -${labelWidth + 12}ch;">${prefix}<span class="muted">${formatDate(e.createdAt)}</span> ${nameHtml} ${e.message}</span>`;
}).join('\n')} /> }).join('')} />
<form id="guestbook-form" class="guestbook-form" style={`margin-left: ${labelWidth + 12}ch`}> <form id="guestbook-form" class="guestbook-form" style={`margin-left: ${labelWidth + 12}ch`}>
<input type="text" name="name" placeholder="name" required maxlength="100" /><br /> <input type="text" name="name" placeholder="name" required maxlength="100" /><br />
<input type="text" name="message" placeholder="message" required maxlength="500" /><br /> <input type="text" name="message" placeholder="message" required maxlength="500" /><br />

View file

@ -104,6 +104,10 @@ section pre {
white-space: pre-wrap; white-space: pre-wrap;
} }
.guestbook-entry {
display: block;
}
.guestbook-form { .guestbook-form {
margin-top: 0.5rem; margin-top: 0.5rem;
font-family: monospace; font-family: monospace;