Email summary styling changed as rendered in gmail?

awesomerobot · April 20, 2023, 1:36pm

I just merged an update, this was an easier change than I expected. This should avoid most of the layout breaking when it’s too long for gmail.

github.com/discourse/discourse

UX: better digest email centering in event of truncation

discourse:main ← discourse:digest-truncation

opened 10:11PM - 19 Apr 23 UTC

awesomerobot

+13 -14

This addresses an issue raised here: https://meta.discourse.org/t/email-summary-…styling-changed-as-rendered-in-gmail/251940 A simplified version of the problem: ```xml <table> <tr> <td></td> <td width="650"> </td> <td></td> </tr> </table> ``` If the width-restricted `td` is too long, gmail will clip the end, including the following `td`. When the last `td` is removed, the first `td` expands to fill the space and pushes all the content to the right, so it's no longer centered. To avoid this, I've updated the structure so that each section centers itself and doesn't rely on the wrapping container. ```xml <table> <tr> <td> <table> <tr> <td></td> <td width="650"> </td> <td></td> </tr> </table> <table> <tr> <td></td> <td width="650"> </td> <td></td> </tr> </table> </td> </tr> </table> ``` So now if gmail clips a too-long email, only the last section that gets clipped will be misaligned. This also results in a slightly different appearance with a wider background, but I think this is a completely fine trade-off. Before: ![Screenshot 2023-04-19 at 6 09 54 PM](https://user-images.githubusercontent.com/1681963/233210791-e61331f3-363d-4d15-955c-1d78c2fc85d3.png) After: ![Screenshot 2023-04-19 at 6 09 37 PM](https://user-images.githubusercontent.com/1681963/233210832-13d0d464-1856-4193-96b4-597af4af1e3a.png)

It’s not an editable template like the others, it’s in the Discourse source here: discourse/app/views/user_notifications/digest.html.erb at main · discourse/discourse · GitHub

Topic		Replies	Views
Summary/digest email often cuts off topic titles UX	20	2005	November 6, 2017
Summary Email feedback Feature email , feedback	103	11229	March 27, 2017
Summary Email Changes Feature email	24	5790	November 22, 2016
Summary email needs a width limit UX	2	875	October 3, 2022
Investigating activity summary email dark mode issues UX activity-summary	6	2136	January 23, 2024

Email summary styling changed as rendered in gmail?

Related topics