fix: fixed message text wraping

front/src/components/MessageComponent.tsx

@@ -12,6 +12,7 @@ export default function MessageComponent({ message, user, channel, deleteMessage
     
     return (
         <div key={message.id} className="message">
+            <div className="message-content">
                 <Link to={`/u/${message.username}`}>{message.username}</Link>:{" "}
                 {message.content.split(" ").map((word, index) => {
                     if (word.startsWith("@")) {
@@ -24,6 +25,7 @@ export default function MessageComponent({ message, user, channel, deleteMessage
                     }
                     return <span key={index}>{word} </span>;
                 })}
+            </div>
             <p>{new Date(message.date * 1000).toLocaleString()}</p>
             <div>
                 {message.content.toLocaleLowerCase().includes("gros cochon") && (

front/src/styles/MessageComponent.css

@@ -3,3 +3,14 @@
     border: 1px solid #270722;
     padding: 10px;
 }
+
+.message-content {
+    word-break: break-word;
+    overflow-wrap: break-word;
+    display: -webkit-box;
+    line-clamp: 10;
+    -webkit-line-clamp: 10;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}