From fbaf750c91062032c0b592419f208d12941502dc Mon Sep 17 00:00:00 2001
From: Gregory Schier <gschier1990@gmail.com>
Date: Fri, 9 Aug 2024 14:28:20 -0700
Subject: [PATCH] Correctly wrap small dialog text

---
 src-web/components/core/Dialog.tsx     | 1 +
 src-web/components/core/InlineCode.tsx | 2 +-
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/src-web/components/core/Dialog.tsx b/src-web/components/core/Dialog.tsx
index e2294767..b5a71d41 100644
--- a/src-web/components/core/Dialog.tsx
+++ b/src-web/components/core/Dialog.tsx
@@ -66,6 +66,7 @@ export function Dialog({
             className={classNames(
               className,
               'grid grid-rows-[auto_auto_minmax(0,1fr)]',
+              'grid-cols-1', // must be here for inline code blocks to correctly break words
               'relative bg-background pointer-events-auto',
               'rounded-lg',
               'border border-background-highlight-secondary shadow-lg shadow-[rgba(0,0,0,0.1)]',
diff --git a/src-web/components/core/InlineCode.tsx b/src-web/components/core/InlineCode.tsx
index 3bf0897c..38bb73de 100644
--- a/src-web/components/core/InlineCode.tsx
+++ b/src-web/components/core/InlineCode.tsx
@@ -7,7 +7,7 @@ export function InlineCode({ className, ...props }: HTMLAttributes<HTMLSpanEleme
       className={classNames(
         className,
         'font-mono text-shrink bg-background-highlight-secondary border border-background-highlight-secondary',
-        'px-1.5 py-0.5 rounded text-fg shadow-inner',
+        'px-1.5 py-0.5 rounded text-fg shadow-inner break-words',
       )}
       {...props}
     />