fix: image preview overlap toolbar message (#4790)

This commit is contained in:
Faisal Amir 2025-03-10 16:36:30 +07:00 committed by GitHub
parent 074992dcd1
commit abfbb2616c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 5 additions and 2 deletions

View File

@ -4,7 +4,7 @@ import { RelativeImage } from '../TextMessage/RelativeImage'
const ImageMessage = ({ image }: { image: string }) => {
return (
<div className="group/file relative mb-2 inline-flex overflow-hidden rounded-xl">
<div className="group/file relative mb-2 mt-1 inline-flex overflow-hidden rounded-xl">
<RelativeImage src={image} />
</div>
)

View File

@ -111,7 +111,10 @@ const MessageContainer: React.FC<
className={twMerge(
'absolute right-0 order-1 flex cursor-pointer items-center justify-start gap-x-2 transition-all',
isUser
? 'hidden group-hover:absolute group-hover:right-4 group-hover:top-4 group-hover:flex'
? twMerge(
'hidden group-hover:absolute group-hover:right-4 group-hover:top-4 group-hover:z-50 group-hover:flex',
image && 'group-hover:-top-2'
)
: 'relative left-0 order-2 flex w-full justify-between opacity-0 group-hover:opacity-100',
props.isCurrentMessage && 'opacity-100'
)}