From e9e93189ff138946688630ec7bbbe2315ca84e27 Mon Sep 17 00:00:00 2001
From: DavG25 <31524206+DavG25@users.noreply.github.com>
Date: Tue, 11 Apr 2023 19:41:29 +0200
Subject: [PATCH] Fix text overflow in chat and instruct mode (#1044)

---
 css/html_cai_style.css      | 11 ++++++++++-
 css/html_instruct_style.css |  9 +++++++++
 2 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/css/html_cai_style.css b/css/html_cai_style.css
index 57c3b5cd..aeb6ce10 100644
--- a/css/html_cai_style.css
+++ b/css/html_cai_style.css
@@ -7,11 +7,13 @@
     padding-right: 20px;
     display: flex;
     flex-direction: column-reverse;
+    word-break: break-word;
+    overflow-wrap: anywhere;
 }
 
 .message {
     display: grid;
-    grid-template-columns: 60px 1fr;
+    grid-template-columns: 60px minmax(0, 1fr);
     padding-bottom: 25px;
     font-size: 15px;
     font-family: Helvetica, Arial, sans-serif;
@@ -73,6 +75,13 @@
     display: inline !important;
 }
 
+.message-body code {
+    overflow-x: auto;
+}
+.message-body :not(pre) > code {
+    white-space: normal !important;
+}
+
 .dark .message-body p em {
     color: rgb(138, 138, 138) !important;
 }
diff --git a/css/html_instruct_style.css b/css/html_instruct_style.css
index bcd31ed0..96ffedf2 100644
--- a/css/html_instruct_style.css
+++ b/css/html_instruct_style.css
@@ -7,6 +7,8 @@
     padding-right: 20px;
     display: flex;
     flex-direction: column-reverse;
+    word-break: break-word;
+    overflow-wrap: anywhere;
 }
 
 .message {
@@ -37,6 +39,13 @@
     display: inline !important;
 }
 
+.message-body code {
+    overflow-x: auto;
+}
+.message-body :not(pre) > code {
+    white-space: normal !important;
+}
+
 .dark .message-body p em {
     color: rgb(138, 138, 138) !important;
 }