From 30c3b9b3521ec77641dc8050852fe757f0e41eb3 Mon Sep 17 00:00:00 2001
From: Jannis Braun <151788261+TheZwiss@users.noreply.github.com>
Date: Wed, 25 Mar 2026 01:56:33 +0100
Subject: [PATCH] fix(web): add aspect-ratio fallback for markdown inline
 images

---
 .../src/components/chat/MarkdownRenderer.tsx  | 21 ++++++++++++-------
 1 file changed, 13 insertions(+), 8 deletions(-)

diff --git a/packages/web/src/components/chat/MarkdownRenderer.tsx b/packages/web/src/components/chat/MarkdownRenderer.tsx
index ff8007b6..8ed1691d 100644
--- a/packages/web/src/components/chat/MarkdownRenderer.tsx
+++ b/packages/web/src/components/chat/MarkdownRenderer.tsx
@@ -187,14 +187,19 @@ function buildComponents(): Components {
 
     // Images (in markdown content — not attachments)
     img: ({ src, alt }) => (
-      <img
-        src={src}
-        alt={alt ?? ''}
-        className="max-w-[400px] max-h-[300px] rounded-md mt-1"
-        loading="lazy"
-        referrerPolicy="no-referrer"
-        crossOrigin="anonymous"
-      />
+      <div
+        className="mt-1 rounded-md overflow-hidden bg-surface-input"
+        style={{ aspectRatio: '4/3', maxWidth: 400, maxHeight: 300 }}
+      >
+        <img
+          src={src}
+          alt={alt ?? ''}
+          className="w-full h-full object-contain"
+          loading="lazy"
+          referrerPolicy="no-referrer"
+          crossOrigin="anonymous"
+        />
+      </div>
     ),
 
     // Tables (GFM)