Fix preformatted text in mail body not breaking on mobile

Preformatted text in mail body is supposed to be wrapped on mobile but isn't due to an incorrect CSS selector.
tutao · Feb 5, 2025 · 283c747 · 283c747
1 parent 9ea0d83
commit 283c747
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 1 deletion.
diff --git a/src/common/gui/main-styles.ts b/src/common/gui/main-styles.ts
@@ -252,7 +252,7 @@ styles.registerStyle("main", () => {
 		".border-top": {
 			"border-top": `1px solid ${theme.content_border}`,
 		},
-		"#mail-body.break-pre pre": {
+		"#shadow-mail-body.break-pre pre": {
 			"white-space": "pre-wrap",
 			"word-break": "normal",
 			"overflow-wrap": "anywhere",

diff --git a/src/mail-app/mail/view/MailViewer.ts b/src/mail-app/mail/view/MailViewer.ts
@@ -390,6 +390,7 @@ export class MailViewer implements Component<MailViewerAttrs> {
 			this.shadowDomRoot.firstChild.remove()
 		}
 		const wrapNode = document.createElement("div")
+		wrapNode.id = "shadow-mail-body"
 		wrapNode.className = "drag selectable touch-callout break-word-links" + (client.isMobileDevice() ? " break-pre" : "")
 		wrapNode.setAttribute("data-testid", "mailBody_label")
 		wrapNode.style.lineHeight = String(this.bodyLineHeight ? this.bodyLineHeight.toString() : size.line_height)