From 9a92271f6fdc4c9dcd697326718f4b02a55d36ec Mon Sep 17 00:00:00 2001
From: Linus Rath <139418639+rathlinus@users.noreply.github.com>
Date: Tue, 19 May 2026 14:38:28 +0200
Subject: [PATCH] fix: prevent mobile dual-scroll and use full width for mail
 content

---
 app/globals.css                               | 7 +++++++
 components/email/email-viewer.tsx             | 5 ++++-
 components/email/thread-conversation-view.tsx | 2 ++
 3 files changed, 13 insertions(+), 1 deletion(-)
diff --git a/app/globals.css b/app/globals.css
index 515e9a5b..70e5b862 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -240,6 +240,13 @@ body {
   padding: 1rem 1.25rem;
 }
 
+@media (max-width: 640px) {
+  .email-content-text {
+    padding-left: 0;
+    padding-right: 0;
+  }
+}
+
 .email-content-text a {
   color: #2563eb;
   text-decoration: underline;
diff --git a/components/email/email-viewer.tsx b/components/email/email-viewer.tsx
index 595dc533..ce196519 100644
--- a/components/email/email-viewer.tsx
+++ b/components/email/email-viewer.tsx
@@ -2792,7 +2792,9 @@ 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; }
   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: 0; padding-right: 0; } }
   img { max-width: 100% !important; height: auto !important; }
   a { color: #1a73e8; }
   table { max-width: 100% !important; table-layout: auto; overflow-wrap: break-word; }
@@ -5171,7 +5173,8 @@ export function EmailViewer({
                 srcDoc={emailIframeSrcDoc}
                 sandbox="allow-same-origin allow-popups allow-popups-to-escape-sandbox"
                 title="Email content"
-                className="w-full border-0"
+                className="w-full border-0 block"
+                scrolling="no"
                 style={{ minHeight: '100px', colorScheme: isDark && emailHasNativeDarkMode ? 'light dark' : 'light' }}
                 onLoad={handleIframeLoad}
               />
diff --git a/components/email/thread-conversation-view.tsx b/components/email/thread-conversation-view.tsx
index df4acb5c..526599c2 100644
--- a/components/email/thread-conversation-view.tsx
+++ b/components/email/thread-conversation-view.tsx
@@ -453,6 +453,7 @@ function EmailCard({
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <meta http-equiv="Content-Security-Policy" content="${csp}">
 <style>
+  html, body { overflow: hidden; }
   body { margin: 0; padding: 0; 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; }
   img { max-width: 100% !important; height: auto !important; }
   a { color: #1a73e8; }
@@ -584,6 +585,7 @@ function EmailCard({
                 sandbox="allow-same-origin allow-popups allow-popups-to-escape-sandbox"
                 title="Email content"
                 className="w-full border-0 block"
+                scrolling="no"
                 style={{ minHeight: '60px' }}
                 onLoad={handleIframeLoad}
               />
