From 0678e86d3dcc0e7e09d7781d3c19f592d66386f0 Mon Sep 17 00:00:00 2001
From: duckietm <troop@mailtjes.com>
Date: Thu, 26 Feb 2026 14:03:47 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=86=99=20Small=20fix=20for=20the=20chat?=
 =?UTF-8?q?=20bubbles,=20they=20where=20a=20bit=20off=20after=20the=20tail?=
 =?UTF-8?q?wind=20upgrade?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../room/widgets/chat/ChatWidgetMessageView.tsx       | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/src/components/room/widgets/chat/ChatWidgetMessageView.tsx b/src/components/room/widgets/chat/ChatWidgetMessageView.tsx
index c19bb3c..4e0c9c2 100644
--- a/src/components/room/widgets/chat/ChatWidgetMessageView.tsx
+++ b/src/components/room/widgets/chat/ChatWidgetMessageView.tsx
@@ -26,13 +26,13 @@ export const ChatWidgetMessageView: FC<ChatWidgetMessageViewProps> = ({
         switch(bubbleWidth)
         {
             case RoomChatSettings.CHAT_BUBBLE_WIDTH_NORMAL:
-                return 'w-350';
+                return 'max-w-[350px]';
             case RoomChatSettings.CHAT_BUBBLE_WIDTH_THIN:
-                return 'w-240';
+                return 'max-w-[240px]';
             case RoomChatSettings.CHAT_BUBBLE_WIDTH_WIDE:
-                return 'w-2000';
+                return 'max-w-[2000px]';
             default:
-                return 'w-350';
+                return 'max-w-[350px]';
         }
     }, [ bubbleWidth ]);
 
@@ -83,8 +83,7 @@ export const ChatWidgetMessageView: FC<ChatWidgetMessageViewProps> = ({
             { chat.styleId === 0 && (
                 <div className="absolute -top-px left-px w-[30px] h-[calc(100%-0.5px)] rounded-[7px] z-1" style={ { backgroundColor: chat.color } } />
             ) }
-            <div className={ `chat-bubble bubble-${ chat.styleId } ${ getBubbleWidth } relative z-1 wrap-break-word min-h-[26px] text-[14px] max-w-[350px]` }
-                style={ { maxWidth: getBubbleWidth } }>
+            <div className={ `chat-bubble bubble-${ chat.styleId } ${ getBubbleWidth } relative z-1 wrap-break-word min-h-[26px] text-[14px]` }>
                 <div className="user-container flex items-center justify-center h-full max-h-[24px] overflow-hidden">
                     { chat.imageUrl && chat.imageUrl.length > 0 && (
                         <div className="user-image absolute top-[-15px] left-[-9.25px] w-[45px] h-[65px] bg-no-repeat bg-center" style={ { backgroundImage: `url(${ chat.imageUrl })` } } />