fix(chat): replace hover bridge with padding to unblock desktop interactions (#885)
* fix(chat): replace hover bridge with padding to unblock desktop interactions PR #826 removed pointer-events-none from the hover bridge div to fix short user message revert button hover, but the transparent 44px full-width bridge blocked all interactions (clicks, text selection) with messages below it on Tauri desktop where the rendering difference made the overlay consume pointer events across the entire message area. Replacing the bridge div approach with pb-12 padding on the message bubble container (max-w-[85%]) when sticky inline hover is active. This extends the hover hit area downward within the bubble's own padding, maintaining continuous hover path from bubble to action buttons without any overlay that could block sibling elements. The padding approach works because: - The 48px bottom padding extends max-w-[85%]'s hover area to cover the gap between bubble bottom and the absolute-positioned buttons - Hovering the padding counts as hovering group/user-shell (parent) - No absolute-positioned invisible layer means nothing blocks the next message's interactive content * fix(chat): reduce hover padding from pb-12 to pb-5 for tighter spacing
This commit is contained in:
@@ -990,7 +990,7 @@ const ChatMessage: React.FC<ChatMessageProps> = ({
|
||||
respectReducedMotion
|
||||
>
|
||||
<div className={cn('relative flex justify-end', !isMobile ? 'group/user-shell' : undefined)}>
|
||||
<div className="max-w-[85%]">
|
||||
<div className={cn('max-w-[85%]', showStickyInlineHoverRow ? 'pb-5' : undefined)}>
|
||||
<div
|
||||
style={{
|
||||
backgroundColor: 'var(--chat-user-message-bg)',
|
||||
@@ -1063,8 +1063,7 @@ const ChatMessage: React.FC<ChatMessageProps> = ({
|
||||
/>
|
||||
) : null}
|
||||
</div>
|
||||
{showStickyInlineHoverRow ? <div aria-hidden="true" className="absolute left-0 right-0 top-full h-11" /> : null}
|
||||
</div>
|
||||
</div>
|
||||
</FadeInOnReveal>
|
||||
)
|
||||
) : (
|
||||
|
||||
Reference in New Issue
Block a user