From 548190dbb2016a2abc6061b8947722d956c6aab4 Mon Sep 17 00:00:00 2001
From: Luke <39926192+LukeWasTakenn@users.noreply.github.com>
Date: Fri, 10 Mar 2023 19:39:30 +0100
Subject: [PATCH] fix(web/alert): fix images escaping container width and
 height

resolves #265
---
 web/src/features/dialog/AlertDialog.tsx | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/web/src/features/dialog/AlertDialog.tsx b/web/src/features/dialog/AlertDialog.tsx
index e92aceb..0d64b37 100644
--- a/web/src/features/dialog/AlertDialog.tsx
+++ b/web/src/features/dialog/AlertDialog.tsx
@@ -49,7 +49,14 @@ const AlertDialog: React.FC = () => {
         title={<ReactMarkdown>{dialogData.header}</ReactMarkdown>}
       >
         <Stack>
-          <ReactMarkdown remarkPlugins={[remarkGfm]}>{dialogData.content}</ReactMarkdown>
+          <ReactMarkdown
+            remarkPlugins={[remarkGfm]}
+            components={{
+              img: ({ ...props }) => <img style={{ maxWidth: '100%', maxHeight: '100%' }} {...props} />,
+            }}
+          >
+            {dialogData.content}
+          </ReactMarkdown>
           <Group position="right" spacing={10}>
             {dialogData.cancel && (
               <Button uppercase variant="default" onClick={() => closeAlert('cancel')} mr={3}>