From 00185e67744671910d3978f20aee23d656335ee3 Mon Sep 17 00:00:00 2001
From: Jocadbz <joaquimmadureira@protonmail.com>
Date: Thu, 15 Jan 2026 22:44:49 -0300
Subject: [PATCH] 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
---
 static/style.css          | 13 +++++++++++++
 templates/pages/chat.html |  3 +++
 2 files changed, 16 insertions(+)

diff --git a/static/style.css b/static/style.css
index c13d44d..d440157 100644
--- a/static/style.css
+++ b/static/style.css
@@ -174,6 +174,8 @@ h1, h2, h3, h4, h5, h6 {
 p, a, li {
     font-family: monospace;
     color: #001858;
+    word-wrap: break-word;
+    overflow-wrap: break-word;
 }
 
 /* Styles for board lists */
@@ -190,6 +192,8 @@ li.board-item {
     border: 1px solid #001858;
     border-radius: 8px;
     transition: transform 0.2s ease, box-shadow 0.2s ease;
+    word-wrap: break-word;
+    overflow-wrap: break-word;
 }
 
 li.board-item:hover {
@@ -213,6 +217,8 @@ p.board-desc {
     margin: 0.5em 0 0 0;
     color: #001858;
     font-size: 1em;
+    word-wrap: break-word;
+    overflow-wrap: break-word;
 }
 
 /* Styles for thread lists */
@@ -229,6 +235,8 @@ li.thread-item {
     border: 1px solid #001858;
     border-radius: 8px;
     transition: transform 0.2s ease, box-shadow 0.2s ease;
+    word-wrap: break-word;
+    overflow-wrap: break-word;
 }
 
 li.thread-item:hover {
@@ -268,6 +276,8 @@ p.thread-info {
     margin-bottom: 1.5em;
     padding: 1.2em 1.5em;
     transition: transform 0.2s ease, box-shadow 0.2s ease;
+    word-wrap: break-word;
+    overflow-wrap: break-word;
 }
 
 .post-item:hover {
@@ -300,6 +310,9 @@ p.thread-info {
     padding: 0.8em;
     line-height: 1.5;
     font-size: 1em;
+    word-wrap: break-word;
+    overflow-wrap: break-word;
+    word-break: break-word;
 }
 
 .post-actions {
diff --git a/templates/pages/chat.html b/templates/pages/chat.html
index e1a44f7..8e13f08 100644
--- a/templates/pages/chat.html
+++ b/templates/pages/chat.html
@@ -73,6 +73,9 @@
             border-radius: 5px;
             line-height: 1.3;
             font-size: 0.9em;
+            word-wrap: break-word;
+            overflow-wrap: break-word;
+            word-break: break-word;
         }
         .chat-message-reply {
             background-color: rgba(0,0,0,0.1);