PLT-3973 - Fixing batched emails for mobile (#3896)

templates/post_batched_post.html

@@ -1,23 +1,31 @@
 {{define "post_batched_post"}}
 
+<style type="text/css">
+    @media screen and (max-width: 480px){
+        a[class="post_btn"] {
+            float: none !important;
+        }
+    }
+</style>
+
 <table style="border-top: 1px solid #ddd; padding: 20px 0; width: 100%">
     <tr>
         <td style="text-align: left">
-            <span style="font-size: 16px; font-weight: bold; color: #555;" >
+            <span style="font-size: 16px; font-weight: bold; color: #555; margin: 0 0 5px; display: inline-block;" >
                 {{.Props.ChannelName}}
             </span>
-            <br/>
+            <a class="post_btn" href="{{.Props.PostLink}}" style="font-size: 13px; background: #2389D7; display: inline-block; border-radius: 2px; color: #fff; padding: 6px 0; width: 120px; text-decoration: none; float:right; text-align: center; margin: 0 0 5px;">
-            <span style="font-weight: bold">
-                @{{.Props.SenderName}}
-            </span>
-            <span style="color: #AAA; font-size: 12px; margin-left: 2px;">
-                {{.Props.Date}}
-            </span>
-        </td>
-        <td valign="top" style="width: 120px; padding-top: 3px;">
-            <a href="{{.Props.PostLink}}" style="background: #2389D7; display: inline-block; border-radius: 2px; color: #fff; padding: 4px 0; width: 120px; text-decoration: none;">
                 {{.Props.Button}}
             </a>
+            <br/>
+            <div style="margin: 5px 0 0;">
+                <span style="font-weight: bold; white-space: nowrap;">
+                    @{{.Props.SenderName}}
+                </span>
+                <span style="color: #AAA; font-size: 12px; margin-left: 2px;">
+                    {{.Props.Date}}
+                </span>
+            </div>
         </td>
     </tr>
     <tr>