From 165310bc72f5ab4ca301a2adbb0cf66eac6826c1 Mon Sep 17 00:00:00 2001
From: Zane <75694352+zanesq@users.noreply.github.com>
Date: Fri, 28 Mar 2025 14:35:00 -0700
Subject: [PATCH] Fix word break and blockquote text color for markdown (#1913)

---
 ui/desktop/src/components/MarkdownContent.tsx | 3 ++-
 ui/desktop/src/styles/main.css                | 6 ++++++
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/ui/desktop/src/components/MarkdownContent.tsx b/ui/desktop/src/components/MarkdownContent.tsx
index ad691f5f..c4ee7037 100644
--- a/ui/desktop/src/components/MarkdownContent.tsx
+++ b/ui/desktop/src/components/MarkdownContent.tsx
@@ -86,10 +86,11 @@ export default function MarkdownContent({ content, className = '' }: MarkdownCon
       <ReactMarkdown
         remarkPlugins={[remarkGfm]}
         rehypePlugins={[rehypeinlineCodeProperty, rehypeRaw]}
-        className={`prose prose-xs dark:prose-invert w-full max-w-full break-words
+        className={`prose prose-xs dark:prose-invert w-full max-w-full word-break
           prose-pre:p-0 prose-pre:m-0 !p-0
           prose-code:break-all prose-code:whitespace-pre-wrap
           prose-table:table prose-table:w-full
+          prose-blockquote:text-inherit
           prose-td:border prose-td:border-borderSubtle prose-td:p-2
           prose-th:border prose-th:border-borderSubtle prose-th:p-2
           prose-thead:bg-bgSubtle
diff --git a/ui/desktop/src/styles/main.css b/ui/desktop/src/styles/main.css
index c461961b..6e6b2bb5 100644
--- a/ui/desktop/src/styles/main.css
+++ b/ui/desktop/src/styles/main.css
@@ -152,6 +152,12 @@
 }
 
 @layer components {
+  /* Tailwind doesn't offer all three with break-words */
+  .word-break {
+    overflow-wrap: break-word;
+    word-wrap: break-word;
+    word-break: break-word;
+  }
   .titlebar-drag-region {
     -webkit-app-region: drag;
     height: 32px;