Merge pull request #707 from kubet/fix/visual-redundancy

fix: mobile responsive text overlap
This commit is contained in:
kubet 2025-06-10 21:06:39 +02:00 committed by GitHub
commit 5545fe99fa
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 21 additions and 16 deletions

View File

@ -249,15 +249,15 @@ export const ChatInput = forwardRef<ChatInputHandles, ChatInputProps>(
} }
}} }}
> >
<div className="w-full text-sm flex flex-col justify-between items-start rounded-lg"> <div className="w-full text-sm flex flex-col justify-between items-start rounded-lg">
<CardContent className={`w-full p-1.5 pb-2 ${bgColor} rounded-2xl border`}> <CardContent className={`w-full p-1.5 pb-2 ${bgColor} rounded-2xl border`}>
<AttachmentGroup <AttachmentGroup
files={uploadedFiles || []} files={uploadedFiles || []}
sandboxId={sandboxId} sandboxId={sandboxId}
onRemove={removeUploadedFile} onRemove={removeUploadedFile}
layout="inline" layout="inline"
maxHeight="216px" maxHeight="216px"
showPreviews={true} showPreviews={true}
/> />
<MessageInput <MessageInput
ref={textareaRef} ref={textareaRef}

View File

@ -112,8 +112,9 @@ export const MessageInput = forwardRef<HTMLTextAreaElement, MessageInputProps>(
}; };
return ( return (
<div className="flex flex-col w-full h-auto gap-4 justify-between"> <div className="relative flex flex-col w-full h-auto gap-4 justify-between">
<div className="flex gap-2 items-center px-2">
<div className="flex flex-col gap-2 items-center px-2">
<Textarea <Textarea
ref={ref} ref={ref}
value={value} value={value}
@ -129,6 +130,7 @@ export const MessageInput = forwardRef<HTMLTextAreaElement, MessageInputProps>(
/> />
</div> </div>
<div className="flex items-center justify-between mt-1 ml-3 mb-1 pr-2"> <div className="flex items-center justify-between mt-1 ml-3 mb-1 pr-2">
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
{!hideAttachments && ( {!hideAttachments && (
@ -155,11 +157,7 @@ export const MessageInput = forwardRef<HTMLTextAreaElement, MessageInputProps>(
<Tooltip> <Tooltip>
<TooltipTrigger> <TooltipTrigger>
<p className='text-sm text-amber-500 hidden sm:block'>Upgrade for full performance</p> <p className='text-sm text-amber-500 hidden sm:block'>Upgrade for full performance</p>
<div className='sm:hidden absolute bottom-0 left-0 right-0 flex justify-center'>
<p className='text-xs text-amber-500 px-2 py-1'>
Upgrade for better performance
</p>
</div>
</TooltipTrigger> </TooltipTrigger>
<TooltipContent> <TooltipContent>
<p>The free tier is severely limited by inferior models; upgrade to experience the true full Suna experience.</p> <p>The free tier is severely limited by inferior models; upgrade to experience the true full Suna experience.</p>
@ -205,6 +203,13 @@ export const MessageInput = forwardRef<HTMLTextAreaElement, MessageInputProps>(
</Button> </Button>
</div> </div>
</div> </div>
{subscriptionStatus === 'no_subscription' && !isLocalMode() &&
<div className='sm:hidden absolute -bottom-8 left-0 right-0 flex justify-center'>
<p className='text-xs text-amber-500 px-2 py-1'>
Upgrade for better performance
</p>
</div>
}
</div> </div>
); );
}, },