refactor(templates): Update to correct details styling (#248)

partials/location/location.html

@@ -1,4 +1,4 @@
-<span style="display:block;margin:2px 0;">{{{ device }}}</span>
-{{#if location }}<span style="display:block;margin:2px 0;">{{ location }}</span>{{/if}}
-{{#if ip }}<span style="display:block;margin:2px 0;">{{t "IP address: %(ip)s" }}</span>{{/if}}
-{{#if timestamp }}<span style="display:block;margin:2px 0;">{{ timestamp }}</span>{{/if}}
+<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{{ device }}}</span>
+{{#if location }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{ location }}</span>{{/if}}
+{{#if ip }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{t "IP address: %(ip)s" }}</span>{{/if}}
+{{#if timestamp }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{ timestamp }}</span>{{/if}}

templates/new_device_login.html

@@ -26,10 +26,10 @@
   <td valign="top">
     <h1 style="font-family: sans-serif; font-weight: normal; margin: 0 0 24px 0; text-align: center;">{{t "New sign-in to Firefox"}}</h1>
     <p class="primary" style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0 0 12px 0; text-align: center;">
-<span style="display:block;margin:2px 0;">{{{ device }}}</span>
-{{#if location }}<span style="display:block;margin:2px 0;">{{ location }}</span>{{/if}}
-{{#if ip }}<span style="display:block;margin:2px 0;">{{t "IP address: %(ip)s" }}</span>{{/if}}
-{{#if timestamp }}<span style="display:block;margin:2px 0;">{{ timestamp }}</span>{{/if}}
+<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{{ device }}}</span>
+{{#if location }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{ location }}</span>{{/if}}
+{{#if ip }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{t "IP address: %(ip)s" }}</span>{{/if}}
+{{#if timestamp }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{ timestamp }}</span>{{/if}}
 
 </p>
   </td>

templates/password_changed.html

@@ -26,10 +26,10 @@
   <td valign="top">
     <h1 style="font-family: sans-serif; font-weight: normal; margin: 0 0 24px 0; text-align: center;">{{t "Password changed successfully"}}</h1>
     <p class="primary" style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0 0 12px 0; text-align: center;">{{t "Your Firefox Account password was successfully changed from the following device:" }}<br/><br/>
-      <span style="display:block;margin:2px 0;">{{{ device }}}</span>
-{{#if location }}<span style="display:block;margin:2px 0;">{{ location }}</span>{{/if}}
-{{#if ip }}<span style="display:block;margin:2px 0;">{{t "IP address: %(ip)s" }}</span>{{/if}}
-{{#if timestamp }}<span style="display:block;margin:2px 0;">{{ timestamp }}</span>{{/if}}
+      <span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{{ device }}}</span>
+{{#if location }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{ location }}</span>{{/if}}
+{{#if ip }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{t "IP address: %(ip)s" }}</span>{{/if}}
+{{#if timestamp }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{ timestamp }}</span>{{/if}}
 
     </p>
   </td>

templates/recovery.html

@@ -26,10 +26,10 @@
   <td valign="top">
     <h1 style="font-family: sans-serif; font-weight: normal; margin: 0 0 24px 0; text-align: center;">{{t "Forgot your password?"}}</h1>
     <p class="primary" style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0 0 24px 0; text-align: center;">{{{t "Click the button within the next hour to set a new password for your Firefox Account. The request came from the following device:" }}}<br/><br/>
-      <span style="display:block;margin:2px 0;">{{{ device }}}</span>
-{{#if location }}<span style="display:block;margin:2px 0;">{{ location }}</span>{{/if}}
-{{#if ip }}<span style="display:block;margin:2px 0;">{{t "IP address: %(ip)s" }}</span>{{/if}}
-{{#if timestamp }}<span style="display:block;margin:2px 0;">{{ timestamp }}</span>{{/if}}
+      <span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{{ device }}}</span>
+{{#if location }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{ location }}</span>{{/if}}
+{{#if ip }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{t "IP address: %(ip)s" }}</span>{{/if}}
+{{#if timestamp }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{ timestamp }}</span>{{/if}}
 
     </p>
   </td>

templates/unblock_code.html

@@ -26,10 +26,10 @@
   <td valign="top">
     <h1 style="font-family: sans-serif; font-weight: normal; margin: 0 0 24px 0; text-align: center;">{{t "Is this you signing in?" }}</h1>
     <p style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0 0 24px 0; text-align: center;">
-    <span style="display:block;margin:2px 0;">{{{ device }}}</span>
-{{#if location }}<span style="display:block;margin:2px 0;">{{ location }}</span>{{/if}}
-{{#if ip }}<span style="display:block;margin:2px 0;">{{t "IP address: %(ip)s" }}</span>{{/if}}
-{{#if timestamp }}<span style="display:block;margin:2px 0;">{{ timestamp }}</span>{{/if}}
+    <span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{{ device }}}</span>
+{{#if location }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{ location }}</span>{{/if}}
+{{#if ip }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{t "IP address: %(ip)s" }}</span>{{/if}}
+{{#if timestamp }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{ timestamp }}</span>{{/if}}
 
   </td>
 </tr>

templates/verify_login.html

@@ -26,10 +26,10 @@
   <td valign="top">
     <h1 style="font-family: sans-serif; font-weight: normal; margin: 0 0 24px 0; text-align: center;">{{t "New sign-in to Firefox"}}</h1>
     <p class="primary" style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0 0 24px 0; text-align: center;">{{t "For added security, please confirm this sign-in to begin syncing with this device:"}}<br/><br/>
-    <span style="display:block;margin:2px 0;">{{{ device }}}</span>
-{{#if location }}<span style="display:block;margin:2px 0;">{{ location }}</span>{{/if}}
-{{#if ip }}<span style="display:block;margin:2px 0;">{{t "IP address: %(ip)s" }}</span>{{/if}}
-{{#if timestamp }}<span style="display:block;margin:2px 0;">{{ timestamp }}</span>{{/if}}
+    <span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{{ device }}}</span>
+{{#if location }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{ location }}</span>{{/if}}
+{{#if ip }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{t "IP address: %(ip)s" }}</span>{{/if}}
+{{#if timestamp }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{ timestamp }}</span>{{/if}}
 
     </p>
   </td>

templates/verify_sync.html

@@ -26,10 +26,10 @@
   <td valign="top">
     <h1 style="font-family: sans-serif; font-weight: normal; margin: 0 0 24px 0; text-align: center;">{{t "Ready, set, sync"}}</h1>
     <p class="primary" style="font-family: sans-serif; font-size: 14px; font-weight: normal; margin: 0 0 24px 0; text-align: center;">{{t "Confirm you’ve received this email and we’ll help you install and sync Firefox on all your devices starting with:"}}<br/><br/>
-      <span style="display:block;margin:2px 0;">{{{ device }}}</span>
-{{#if location }}<span style="display:block;margin:2px 0;">{{ location }}</span>{{/if}}
-{{#if ip }}<span style="display:block;margin:2px 0;">{{t "IP address: %(ip)s" }}</span>{{/if}}
-{{#if timestamp }}<span style="display:block;margin:2px 0;">{{ timestamp }}</span>{{/if}}
+      <span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{{ device }}}</span>
+{{#if location }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{ location }}</span>{{/if}}
+{{#if ip }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{t "IP address: %(ip)s" }}</span>{{/if}}
+{{#if timestamp }}<span style="font-family:sans-serif; color: #424f59; display: block; font-size: 13px; margin: 2px 0;">{{ timestamp }}</span>{{/if}}
 
       
     </p>