UI: Fix word wrapping for long text content

- Add word-wrap and overflow-wrap to all content areas
- Prevents horizontal overflow on long words/URLs
- Fixes layout breaking with continuous text (e.g., 'owohhh...')
- Applied to post content, chat messages, lists, and paragraphs
jocadbz
Joca 2026-01-15 22:44:49 -03:00
parent 69a62f0ad5
commit 00185e6774
Signed by: jocadbz
GPG Key ID: B1836DCE2F50BDF7
2 changed files with 16 additions and 0 deletions

View File

@ -174,6 +174,8 @@ h1, h2, h3, h4, h5, h6 {
p, a, li { p, a, li {
font-family: monospace; font-family: monospace;
color: #001858; color: #001858;
word-wrap: break-word;
overflow-wrap: break-word;
} }
/* Styles for board lists */ /* Styles for board lists */
@ -190,6 +192,8 @@ li.board-item {
border: 1px solid #001858; border: 1px solid #001858;
border-radius: 8px; border-radius: 8px;
transition: transform 0.2s ease, box-shadow 0.2s ease; transition: transform 0.2s ease, box-shadow 0.2s ease;
word-wrap: break-word;
overflow-wrap: break-word;
} }
li.board-item:hover { li.board-item:hover {
@ -213,6 +217,8 @@ p.board-desc {
margin: 0.5em 0 0 0; margin: 0.5em 0 0 0;
color: #001858; color: #001858;
font-size: 1em; font-size: 1em;
word-wrap: break-word;
overflow-wrap: break-word;
} }
/* Styles for thread lists */ /* Styles for thread lists */
@ -229,6 +235,8 @@ li.thread-item {
border: 1px solid #001858; border: 1px solid #001858;
border-radius: 8px; border-radius: 8px;
transition: transform 0.2s ease, box-shadow 0.2s ease; transition: transform 0.2s ease, box-shadow 0.2s ease;
word-wrap: break-word;
overflow-wrap: break-word;
} }
li.thread-item:hover { li.thread-item:hover {
@ -268,6 +276,8 @@ p.thread-info {
margin-bottom: 1.5em; margin-bottom: 1.5em;
padding: 1.2em 1.5em; padding: 1.2em 1.5em;
transition: transform 0.2s ease, box-shadow 0.2s ease; transition: transform 0.2s ease, box-shadow 0.2s ease;
word-wrap: break-word;
overflow-wrap: break-word;
} }
.post-item:hover { .post-item:hover {
@ -300,6 +310,9 @@ p.thread-info {
padding: 0.8em; padding: 0.8em;
line-height: 1.5; line-height: 1.5;
font-size: 1em; font-size: 1em;
word-wrap: break-word;
overflow-wrap: break-word;
word-break: break-word;
} }
.post-actions { .post-actions {

View File

@ -73,6 +73,9 @@
border-radius: 5px; border-radius: 5px;
line-height: 1.3; line-height: 1.3;
font-size: 0.9em; font-size: 0.9em;
word-wrap: break-word;
overflow-wrap: break-word;
word-break: break-word;
} }
.chat-message-reply { .chat-message-reply {
background-color: rgba(0,0,0,0.1); background-color: rgba(0,0,0,0.1);