fix: prevent mobile dual-scroll and use full width for mail content

This commit is contained in:
Linus Rath
2026-05-19 14:38:28 +02:00
parent 97ddf935a8
commit 9a92271f6f
3 changed files with 13 additions and 1 deletions
+7
View File
@@ -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;
+4 -1
View File
@@ -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}
/>
@@ -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}
/>