From: Herve Saint-Amand <git@saintamh.org>
Date: Mon, 23 Jan 2017 22:26:34 +0000 (+0000)
Subject: Put the user avatar in a <p> block
X-Git-Tag: live~3636^2~6
X-Git-Url: https://git.openstreetmap.org/rails.git/commitdiff_plain/25d80789dda4d989f5b5e168ddd05a20d11c183b

Put the user avatar in a <p> block

This improves rendering on those clients that set the margin to 0 on <p> blocks.
---

diff --git a/app/views/notifier/_message_body.html.erb b/app/views/notifier/_message_body.html.erb
index 29ecf9ea8..a108643ce 100644
--- a/app/views/notifier/_message_body.html.erb
+++ b/app/views/notifier/_message_body.html.erb
@@ -1,15 +1,21 @@
 <table style="font-size: 15px; font-style: italic; margin: 15px; background-color: #eee; width: 520px">
   <tr>
-    <td style="width: 50px; vertical-align: top; padding: 15px">
-      <%= link_to(
-          image_tag(
-            attachments["avatar.png"].url,
-            alt: @author,
-            title: @author
-          ),
-          user_url(@author, :host => SERVER_URL),
-          :target => "_blank"
-      ) %>
+    <td style="width: 50px; vertical-align: top; padding: 5px 15px">
+      <%# Some email clients (e.g. Yahoo as of 2017-01) remove the margin
+        on <p> tags. Since the body itself always starts with a <p>, by
+        wrapping the image here in a <p> as well, we ensure that they will at
+        least always be aligned with each other. %>
+      <p>
+        <%= link_to(
+            image_tag(
+              attachments["avatar.png"].url,
+              alt: @author,
+              title: @author
+            ),
+            user_url(@author, :host => SERVER_URL),
+            :target => "_blank"
+        ) %>
+      </p>
     </td>
     <td style="text-align: left; vertical-align: top; padding-right: 10px">
       <%= body %>