fix: notes preview text wrapping and right margin

Add word-break/overflow-wrap to .detail-body so long text wraps
properly, and add right margin inside the preview card for balanced
spacing.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-03 14:28:06 +00:00
parent 6871330ce8
commit 88a001261a
2 changed files with 4 additions and 1 deletions

View File

@@ -736,6 +736,9 @@ a:hover { color: var(--accent-hover); }
.detail-body {
line-height: 1.75;
color: var(--text);
overflow-wrap: break-word;
word-break: break-word;
min-width: 0;
}
.detail-body p { margin-bottom: 1em; }

View File

@@ -19,7 +19,7 @@
</div>
</div>
{% if item.body %}
<div class="card"><div class="detail-body" style="white-space:pre-wrap;font-family:var(--font-body)">{{ item.body }}</div></div>
<div class="card" style="overflow:hidden"><div class="detail-body" style="white-space:pre-wrap;font-family:var(--font-body);margin-right:20px">{{ item.body }}</div></div>
{% else %}
<div class="card"><div class="text-muted" style="padding:20px">No content yet. <a href="/notes/{{ item.id }}/edit">Start writing</a></div></div>
{% endif %}