From 131e4a5e0629bab908b7a9c3e2e291b6431cef11 Mon Sep 17 00:00:00 2001
From: LemonNeko <chheese048@gmail.com>
Date: Tue, 25 Mar 2025 17:20:40 +0800
Subject: [PATCH] style(stage-web): fix word break (#96)

* style(stage-web): fix word break

* chore: remove unnecessary comments
---
 apps/stage-web/src/components/Widgets/ChatHistory.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/apps/stage-web/src/components/Widgets/ChatHistory.vue b/apps/stage-web/src/components/Widgets/ChatHistory.vue
index 33ab8eeca..1bcc607db 100644
--- a/apps/stage-web/src/components/Widgets/ChatHistory.vue
+++ b/apps/stage-web/src/components/Widgets/ChatHistory.vue
@@ -52,7 +52,7 @@ onTokenLiteral(async () => {
             </div>
             <div v-if="sending" i-eos-icons:three-dots-loading />
             <div
-              v-else class="markdown-content text-violet-500" text="base <sm:xs"
+              v-else class="markdown-content break-words text-violet-500" text="base <sm:xs"
               v-html="process(message.content as string)"
             />
           </div>
@@ -66,7 +66,7 @@ onTokenLiteral(async () => {
               <span text-xs text="primary-400/90 dark:primary-600/90" font-semibold class="inline <sm:hidden">{{ t('stage.chat.message.character-name.airi') }}</span>
             </div>
             <div v-if="sending" i-eos-icons:three-dots-loading />
-            <div v-else class="markdown-content" text="base <sm:xs" v-html="process(message.content as string)" />
+            <div v-else class="markdown-content break-words" text="base <sm:xs" v-html="process(message.content as string)" />
           </div>
         </div>
         <div v-else-if="message.role === 'user'" flex="~ row-reverse" ml="12">
@@ -77,7 +77,7 @@ onTokenLiteral(async () => {
             <div>
               <span text-xs text="cyan-400/90 dark:cyan-600/90" font-semibold class="inline <sm:hidden">{{ t('stage.chat.message.character-name.you') }}</span>
             </div>
-            <div v-if="message.content" class="markdown-content" text="base <sm:xs" v-html="process(message.content as string)" />
+            <div v-if="message.content" class="markdown-content break-words" text="base <sm:xs" v-html="process(message.content as string)" />
             <div v-else />
           </div>
         </div>