Skip to content

fix: remove container border/bg from image previews in chat#399

Merged
wesbillman merged 2 commits intomainfrom
fix-image-preview-container
Apr 24, 2026
Merged

fix: remove container border/bg from image previews in chat#399
wesbillman merged 2 commits intomainfrom
fix-image-preview-container

Conversation

@wesbillman
Copy link
Copy Markdown
Collaborator

Summary

Removes the visible container box (border, background, flex centering) around image preview thumbnails in chat messages. Images now render cleanly with rounded corners applied directly to the <img> element.

Changes

File: desktop/src/shared/ui/markdown.tsx (3 hunks)

  1. Image preview wrapper — removed flex items-center justify-center overflow-hidden rounded-2xl border border-border/70 bg-muted/40, tightened mt-3mt-1
  2. Image element — added rounded-xl for corner rounding directly on the image (replaces container-level overflow-hidden clipping)
  3. Multi-image gallery gridmt-3mt-1 for consistent spacing

What's preserved

  • Lightbox click-to-expand behavior (DOM structure untouched)
  • Video preview path (completely separate code path)
  • Gallery grid layout ([&_div]:mt-0 [&_div]:max-w-none overrides still target correctly)

NIT (design awareness)

Transparent PNGs will now show the chat background directly instead of the old bg-muted/40 fill. This is the intended behavior — removing the container means no artificial background behind images.

Before / After

Before: Images wrapped in a bordered, background-filled container
After: Images render directly with rounded corners, no visible container

@wesbillman
Copy link
Copy Markdown
Collaborator Author

BEFORE:
Screenshot 2026-04-24 at 10 53 15 AM

AFTER:
Screenshot 2026-04-24 at 10 52 44 AM

@wesbillman wesbillman enabled auto-merge (squash) April 24, 2026 18:15
@wesbillman wesbillman merged commit fa9f3f1 into main Apr 24, 2026
13 checks passed
@wesbillman wesbillman deleted the fix-image-preview-container branch April 24, 2026 18:16
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant