From 7adee1cacf93903354b6d6733fb97151abcb2b86 Mon Sep 17 00:00:00 2001
From: t8y2 <1156263951@qq.com>
Date: Mon, 22 Jun 2026 14:58:56 +0800
Subject: [PATCH] fix(ui): enable text wrapping for toast messages

- Add max-w-3xl to limit toast width (768px on desktop, 90vw on mobile)
- Use whitespace-pre-wrap to allow automatic line breaks
- Add break-words to prevent long words from overflowing
- Long error messages now wrap instead of extending off-screen
---
 apps/desktop/src/App.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/desktop/src/App.vue b/apps/desktop/src/App.vue
index f0053885b1..ed60fbf4ef 100644
--- a/apps/desktop/src/App.vue
+++ b/apps/desktop/src/App.vue
@@ -1548,7 +1548,7 @@ onUnmounted(() => {
       </div>
       <Teleport to="body">
         <Transition name="toast">
-          <div v-if="toastVisible" class="fixed bottom-6 inset-x-0 w-max mx-auto z-99999 px-4 py-2 rounded-lg bg-foreground text-background text-sm shadow-lg select-text">
+          <div v-if="toastVisible" class="fixed bottom-6 inset-x-0 w-max max-w-[90vw] sm:max-w-3xl mx-auto z-99999 px-4 py-2 rounded-lg bg-foreground text-background text-sm shadow-lg select-text whitespace-pre-wrap break-words">
             {{ toastMessage }}
           </div>
         </Transition>