From 44297ffe786fbf6635aad86090b8d1f398e8592f Mon Sep 17 00:00:00 2001
From: adamelmore <2363879+adamdottv@users.noreply.github.com>
Date: Fri, 9 Jan 2026 11:03:08 -0600
Subject: [PATCH] fix(app): break words in user message

---
 packages/ui/src/components/message-part.css | 22 ++++++++++-----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/packages/ui/src/components/message-part.css b/packages/ui/src/components/message-part.css
index dd8e30ba6..7d191e8b4 100644
--- a/packages/ui/src/components/message-part.css
+++ b/packages/ui/src/components/message-part.css
@@ -77,7 +77,7 @@
 
   [data-slot="user-message-text"] {
     white-space: pre-wrap;
-    word-break: break-all;
+    word-break: break-word;
     overflow: hidden;
     background: var(--surface-base);
     padding: 8px 12px;
@@ -254,6 +254,7 @@
 
   scrollbar-width: none;
   -ms-overflow-style: none;
+
   &::-webkit-scrollbar {
     display: none;
   }
@@ -271,6 +272,7 @@
   /* Hide scrollbar */
   scrollbar-width: none;
   -ms-overflow-style: none;
+
   &::-webkit-scrollbar {
     display: none;
   }
@@ -413,26 +415,23 @@
       border: 1.5px solid transparent;
       background:
         linear-gradient(var(--background-base) 0 0) padding-box,
-        conic-gradient(
-            from var(--border-angle),
-            transparent 0deg,
-            transparent 0deg,
-            var(--border-warning-strong, var(--border-warning-selected)) 300deg,
-            var(--border-warning-base) 360deg
-          )
-          border-box;
+        conic-gradient(from var(--border-angle),
+          transparent 0deg,
+          transparent 0deg,
+          var(--border-warning-strong, var(--border-warning-selected)) 300deg,
+          var(--border-warning-base) 360deg) border-box;
       animation: chase-border 2.5s linear infinite;
       pointer-events: none;
       z-index: -1;
     }
 
-    & > *:first-child {
+    &>*:first-child {
       border-top-left-radius: 6px;
       border-top-right-radius: 6px;
       overflow: hidden;
     }
 
-    & > *:last-child {
+    &>*:last-child {
       border-bottom-left-radius: 6px;
       border-bottom-right-radius: 6px;
       overflow: hidden;
@@ -458,6 +457,7 @@
   from {
     --border-angle: 0deg;
   }
+
   to {
     --border-angle: 360deg;
   }