Copy and style improvements to mailer

app/helpers/magic_link_helper.rb

@@ -1,5 +1,5 @@
 module MagicLinkHelper
   def magic_link_code(magic_link)
-    magic_link.code.scan(/.{3}/).join("-")
+    magic_link.code
   end
 end

app/views/layouts/mailer.html.erb

@@ -65,7 +65,7 @@
         border-radius: 3rem;
         color: #ffffff;
         font-weight: 500;
-        padding: 0.2em 0.4em;
+        padding: 0.5em 1em;
         text-decoration: none;
         white-space: nowrap;
       }
@@ -81,7 +81,7 @@
         margin-bottom: 0;
         margin-top: 0;
       }
-      
+
       .footer {
         border-top: 1px solid #ccc;
         margin-top: 3em;
@@ -107,10 +107,18 @@
         text-transform: uppercase;
       }
 
+      .margin-block-end-double {
+        margin-bottom: 2em;
+      }
+
+      .margin-block-start-double {
+        margin-top: 2em;
+      }
+
       .subtitle {
         font-size: 1.2em;
         font-weight: normal;
-        margin-bottom: 2em;
+        margin-bottom: 1em;
         margin-top: 0.1em;
       }
 
@@ -119,6 +127,10 @@
         font-weight: 900;
         margin-bottom: 0;
       }
+
+      .txt-large {
+        font-size: 1.2em;
+      }
     </style>
   </head>
 

app/views/mailers/magic_link_mailer/sign_in_instructions.html.erb

@@ -1,13 +1,12 @@
-<h1>Sign in to Fizzy</h1>
+<h1 class="title">Sign in to Fizzy</h1>
+<p class="subtitle">Hit the button below to sign in to Fizzy on this device</p>
 
-<div>
-  <p>Hit the button below to sign in to Fizzy on this device</p>
+<%= link_to "Sign in to Fizzy", session_magic_link_url(code: @magic_link.code), class: "btn" %>
 
-  <div><%= link_to "Sign in to Fizzy", session_magic_link_url(code: @magic_link.code), class: "btn" %></div>
-</div>
+<p class="margin-block-start-double">If you're signing in on another device, enter this special code:
+  <br><strong class="txt-large"><%= magic_link_code(@magic_link) %></strong>
+</p>
 
-<div>
-  <p>If you're signing in on another device, enter the code below:</p>
+<p class="footer">Need help? <%= mail_to "support@37signals.com", "Email us"%>.
+</p>
 
-  <b><%= magic_link_code(@magic_link) %></b>
-</div>

app/views/mailers/magic_link_mailer/sign_in_instructions.text.erb

@@ -4,5 +4,5 @@ Sign in to Fizzy
 Open this link in your browser to login on this device:
 <%= session_magic_link_url(code: @magic_link.code) %>
 
-If you're signing in on another device, enter the code below:
+If you're signing in on another device, enter this code:
 <%= magic_link_code(@magic_link) %>

app/views/mailers/notification/bundle_mailer/notification.html.erb

@@ -1,7 +1,7 @@
 <tr>
   <td>
     <h1 class="title">Everything since <%= @bundle.starts_at.strftime("%-l%P on %A, %B %-d") %></h1>
-    <p class="subtitle">You have <%= link_to pluralize(@notifications.count, "new notification"), notifications_url %>.</p>
+    <p class="subtitle margin-block-end-double">You have <%= link_to pluralize(@notifications.count, "new notification"), notifications_url %>.</p>
     <%= render partial: "notification/bundle_mailer/notification", collection: @notifications, as: :notification %>
     <p class="footer">BOXCAR emails you about new notifications every few hours. <br>
       <%= link_to "Change how often you get these", notifications_settings_url %>