From 26ccf9e3b40cee6f04a28227106159458bc308ad Mon Sep 17 00:00:00 2001
From: dealerweb <dealerweb@users.noreply.github.com>
Date: Mon, 1 Jun 2026 14:42:47 +0200
Subject: [PATCH] Fix: email body clipped under the fold when it sets html/body
 height:100%

Some emails (Outlook / templated HTML) set `html, body { height: 100% }` in
their own <style>. Combined with the viewer srcDoc's `overflow: hidden` and the
scrollHeight-based iframe auto-resize, the measured height collapses to the
iframe's initial size, so everything below the first screenful (often just the
header/logo) is clipped and the rest of the message is invisible.

Force `height: auto !important` on html/body in the rendered srcDoc so the
document grows to its real content height before scrollHeight is measured.
---
 components/email/email-viewer.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)
diff --git a/components/email/email-viewer.tsx b/components/email/email-viewer.tsx
index 08b6d603..97c4b816 100644
--- a/components/email/email-viewer.tsx
+++ b/components/email/email-viewer.tsx
@@ -2899,7 +2899,10 @@ export function EmailViewer({
 <html style="color-scheme: ${colorScheme};"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1">
 <meta http-equiv="Content-Security-Policy" content="${iframeCsp}">
 <style>
-  html, body { overflow: hidden; }
+  /* Force content height: some emails set html/body { height: 100% }, which -
+     combined with overflow:hidden and our scrollHeight-based auto-resize -
+     collapses the measured height and clips everything below the fold. */
+  html, body { overflow: hidden; height: auto !important; }
   body { margin: 0; padding: ${bodyPadding}; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; font-size: 14px; line-height: 1.6; color: #1a1a1a; background: #ffffff; word-wrap: break-word; overflow-wrap: break-word; }
   @media (max-width: 640px) { body { padding-left: ${mobileBodyPaddingX}; padding-right: ${mobileBodyPaddingX}; } }
   img { max-width: 100% !important; height: auto !important; }
