Skip to content

fix(email-viewer): stop styled emails gluing to the corner#595

Open
shukiv wants to merge 1 commit into
bulwarkmail:mainfrom
shukiv:fix/email-body-padding-heuristic
Open

fix(email-viewer): stop styled emails gluing to the corner#595
shukiv wants to merge 1 commit into
bulwarkmail:mainfrom
shukiv:fix/email-body-padding-heuristic

Conversation

@shukiv

@shukiv shukiv commented Jul 11, 2026

Copy link
Copy Markdown
Contributor

Problem

The read-view zeroes the iframe body padding whenever an email contains a <style> tag (hasOwnLayout = hasStyleTag && !isWordHtml), assuming such mails bring their own layout. But many transactional emails ship a <style> block only for web fonts and have no outer gutter of their own — so their content renders flush against the top-left corner.

Example: a Namecheap order-summary receipt (has a <style> block, wrapper is a plain <div>, order table is width="95%", no background) rendered glued to the edge.

Fix

A <style> tag alone is too weak a signal. Only drop the default gutter when the email paints a full-bleed background canvas — a width:100% element carrying a background colour — which is the one case where our padding shows as an ugly frame around the email's own background. Otherwise keep the 1rem 1.25rem gutter.

Testing

  • Namecheap receipt (<style> + no full-bleed canvas): now gets the gutter ✅
  • Marketing emails with a width:100% bgcolor canvas: still edge-to-edge (no white frame) ✅
  • Bare HTML / Word HTML: unchanged (already padded)
  • tsc clean; lint clean

@rathlinus

Copy link
Copy Markdown
Member

not sure, i want this as a setting i think

@shukiv

shukiv commented Jul 11, 2026

Copy link
Copy Markdown
Contributor Author

Makes sense. Two ways to slice it:

1. Keep the refined detection as the default + add an override setting — e.g. Message spacing: Auto / Always / Edge-to-edge, Auto = this PR's heuristic. Works out of the box, power users can force either extreme.

2. Drop the heuristic, plain toggle"Add padding around message content" (default on). Simpler, but full-bleed newsletters with a coloured canvas get a white frame when it's on.

I'd lean to (1) with Auto as default. Happy to build whichever you prefer — which do you want?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants