Merge pull request #4818 from consul/emails_styles

System emails design

app/controllers/admin/system_emails_controller.rb

@@ -104,7 +104,7 @@ class Admin::SystemEmailsController < Admin::BaseController
       comment = Comment.where(commentable_type: "Budget::Investment").last
       if comment
         @email = EvaluationCommentEmail.new(comment)
-        @email_to = @email.to.first
+        @email_to = @email.to.first || current_user
       else
         redirect_to admin_system_emails_path,
                     alert: t("admin.system_emails.alert.no_evaluation_comments")

app/helpers/mailer_helper.rb

@@ -15,4 +15,40 @@ module MailerHelper
       style: "color: #2895F1; text-decoration:none;"
     )
   end
+
+  def mailer_simple_format(text)
+    simple_format(sanitize_and_auto_link(text), { style: css_for_mailer_text }, sanitize: false)
+  end
+
+  def mailer_font_family
+    "font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;"
+  end
+
+  def css_for_mailer_heading
+    mailer_font_family + "font-size: 48px;"
+  end
+
+  def css_for_mailer_subheading
+    mailer_font_family + "font-size: 20px; font-weight: bold; line-height: 24px; margin-bottom: 2px;"
+  end
+
+  def css_for_mailer_text
+    mailer_font_family + "font-size: 14px;font-weight: normal;line-height: 24px;"
+  end
+
+  def css_for_mailer_button
+    mailer_font_family + "background: #004a83;border-radius: 6px;color: #fff!important;display: inline-block;font-weight: bold;margin: 0;min-width: 200px;padding: 10px 15px;text-align: center;text-decoration: none;"
+  end
+
+  def css_for_mailer_link
+    "color: #1779ba; text-decoration: underline;"
+  end
+
+  def css_for_mailer_quote
+    "border-left: 2px solid #DEE0E3;font-style: italic;margin-left: 20px;padding:0px 10px;"
+  end
+
+  def css_for_mailer_content
+    "padding-bottom: 20px; padding-left: 10px;"
+  end
 end

app/mailers/devise_mailer.rb

@@ -1,5 +1,5 @@
 class DeviseMailer < Devise::Mailer
-  helper :application, :settings
+  helper :application, :settings, :mailer
   include Devise::Controllers::UrlHelpers
   default template_path: "devise/mailer"
 

app/views/devise/mailer/confirmation_instructions.html.erb

@@ -1,18 +1,20 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
 
-  <h1 style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;">
+  <h1 style="<%= css_for_mailer_heading %>">
     <%= t("devise_views.mailer.confirmation_instructions.title") %>
   </h1>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("devise_views.mailer.confirmation_instructions.welcome") %> <strong><%= @email %></strong>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("devise_views.mailer.confirmation_instructions.text") %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
-    <%= link_to t("devise_views.mailer.confirmation_instructions.confirm_link"), confirmation_url(@resource, confirmation_token: @token), style: "color: #2895F1; text-decoration:none;" %>
+    <%= link_to t("devise_views.mailer.confirmation_instructions.confirm_link"),
+                confirmation_url(@resource, confirmation_token: @token),
+                style: css_for_mailer_link %>
   </p>
 </td>

app/views/devise/mailer/reset_password_instructions.html.erb

@@ -1,22 +1,24 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
 
-  <h1 style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;">
+  <h1 style="<%= css_for_mailer_heading %>">
     <%= t("devise_views.mailer.reset_password_instructions.title") %>
   </h1>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("devise_views.mailer.reset_password_instructions.hello") %> <strong><%= @resource.email %></strong>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("devise_views.mailer.reset_password_instructions.text") %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
-    <%= link_to t("devise_views.mailer.reset_password_instructions.change_link"), edit_password_url(@resource, reset_password_token: @token), style: "color: #2895F1; text-decoration:none;" %>
+    <%= link_to t("devise_views.mailer.reset_password_instructions.change_link"),
+                edit_password_url(@resource, reset_password_token: @token),
+                style: css_for_mailer_link %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("devise_views.mailer.reset_password_instructions.ignore_text") %> <%= t("devise_views.mailer.reset_password_instructions.info_text") %>
   </p>
 </td>

app/views/devise/mailer/unlock_instructions.html.erb

@@ -1,22 +1,24 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
 
-  <h1 style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;">
+  <h1 style="<%= css_for_mailer_heading %>">
     <%= t("devise_views.mailer.unlock_instructions.title") %>
   </h1>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("devise_views.mailer.unlock_instructions.hello") %> <strong><%= @resource.email %></strong>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("devise_views.mailer.unlock_instructions.info_text") %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("devise_views.mailer.unlock_instructions.instructions_text") %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
-    <%= link_to t("devise_views.mailer.unlock_instructions.unlock_link"), unlock_url(@resource, unlock_token: @token), style: "color: #2895F1; text-decoration:none;" %>
+    <%= link_to t("devise_views.mailer.unlock_instructions.unlock_link"),
+                unlock_url(@resource, unlock_token: @token),
+                style: css_for_mailer_link %>
   </p>
 </td>

app/views/mailer/already_confirmed.html.erb

@@ -1,17 +1,19 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
 
-  <h1 style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;">
+  <h1 style="<%= css_for_mailer_heading %>">
     <%= t("mailers.already_confirmed.subject") %>
   </h1>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.already_confirmed.info") %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.already_confirmed.new_password") %>
   </p>
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+
-    <%= link_to t("devise_views.shared.links.new_password"), new_password_url(@user), style: "color: #2895F1; text-decoration:none;" %>
+  <p style="<%= css_for_mailer_text %>">
+    <%= link_to t("devise_views.shared.links.new_password"),
+                new_password_url(@user), style: css_for_mailer_link %>
   </p>
 </td>

app/views/mailer/budget_investment_created.html.erb

@@ -1,39 +1,46 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
 
-  <h1 style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;">
+  <h1 style="<%= css_for_mailer_heading %>">
     <%= t("mailers.budget_investment_created.title") %>
   </h1>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
-    <%= sanitize(t("mailers.budget_investment_created.intro",
+    <%= sanitize(
-           author: @investment.author.name)) %>
+      t("mailers.budget_investment_created.intro", author: @investment.author.name)
+    ) %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
-    <%= sanitize(t("mailers.budget_investment_created.text",
+    <%= sanitize(
-           investment: @investment.title,
+      t("mailers.budget_investment_created.text",
-           budget: @investment.budget.name)) %>
+        investment: @investment.title,
+        budget: @investment.budget.name)
+    ) %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
-    <%= sanitize(t("mailers.budget_investment_created.follow",
+    <%= sanitize(
-           link: link_to(t("mailers.budget_investment_created.follow_link"), budgets_url))) %>
+      t("mailers.budget_investment_created.follow",
+        link: link_to(t("mailers.budget_investment_created.follow_link"), budgets_url,
+        style: css_for_mailer_link)
+      ),
+      attributes: %w[href style]
+    ) %>
   </p>
 
   <table style="width: 100%;">
     <tbody>
       <tr>
         <td style="padding-bottom: 12px; text-align: center;">
-          <%= link_to budget_investment_url(@investment.budget, @investment, anchor: "social-share"), style: "font-family: 'Open Sans','Helvetica Neue',arial,sans-serif; background: #f7f5f2; border-radius: 6px; color: #3d3d66!important; font-weight: bold; margin: 0px; padding: 10px 15px; text-align: center; text-decoration: none; min-width: 160px; display: inline-block;" do %>
+          <%= link_to budget_investment_url(@investment.budget, @investment, anchor: "social-share"), style: css_for_mailer_button do %>
-              <%= image_tag("icon_mailer_share.png", style: "border: 0; display: inline-block; width: 100%; max-width: 16px", alt: "") %>
+            <%= t("mailers.budget_investment_created.share") %>
-              <%= t("mailers.budget_investment_created.share") %>
           <% end %>
         </td>
       </tr>
     </tbody>
   </table>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.budget_investment_created.sincerely") %>
   </p>
 </td>

app/views/mailer/budget_investment_selected.html.erb

@@ -1,10 +1,14 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <h1 style="<%= css_for_mailer_heading %>">
+    <%= t("mailers.budget_investment_selected.title") %>
+  </h1>
+
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.budget_investment_selected.hi") %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.budget_investment_selected.share") %>
   </p>
 
@@ -12,20 +16,19 @@
     <tbody>
       <tr>
         <td style="padding-bottom: 12px; text-align: center;">
-          <%= link_to budget_investment_url(@investment.budget, @investment, anchor: "social-share"), style: "font-family: 'Open Sans','Helvetica Neue',arial,sans-serif; background: #f7f5f2; border-radius: 6px; color: #3d3d66 !important; font-weight: bold; margin: 0px; padding: 10px 15px; text-align: center; text-decoration: none; min-width: 160px; display: inline-block;" do %>
+          <%= link_to budget_investment_url(@investment.budget, @investment, anchor: "social-share"), style: css_for_mailer_button do %>
-              <%= image_tag("icon_mailer_share.png", style: "border: 0; display: inline-block; width: 100%; max-width: 16px", alt: "") %>
+            <%= t("mailers.budget_investment_selected.share_button") %>
-              <%= t("mailers.budget_investment_selected.share_button") %>
           <% end %>
         </td>
       </tr>
     </tbody>
   </table>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.budget_investment_selected.thanks") %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.budget_investment_selected.sincerely") %>
   </p>
 </td>

app/views/mailer/budget_investment_unfeasible.html.erb

@@ -1,24 +1,33 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <h1 style="<%= css_for_mailer_heading %>">
+    <%= t("mailers.budget_investment_unfeasible.title") %>
+  </h1>
+
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.budget_investment_unfeasible.hi") %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px; padding-left: 12px; border-left: 2px solid #ccc;">
+  <p style="<%= css_for_mailer_text + css_for_mailer_quote %>">
     <%= @investment.unfeasibility_explanation %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
-  <%= sanitize(t("mailers.budget_investment_unfeasible.new",
+    <%= sanitize(
-      url: link_to(t("mailers.budget_investment_unfeasible.new_href"),
+      t("mailers.budget_investment_unfeasible.new",
-      new_budget_investment_url(@investment.budget), style: "color: #2895F1; text-decoration: underline;"))) %>
+        url: link_to(t("mailers.budget_investment_unfeasible.new_href"),
+                     new_budget_investment_url(@investment.budget),
+                     style: css_for_mailer_link)
+      ),
+      attributes: %w[href style]
+    ) %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.budget_investment_unfeasible.sorry") %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.budget_investment_unfeasible.sincerely") %>
   </p>
 </td>

app/views/mailer/budget_investment_unselected.html.erb

@@ -1,14 +1,18 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <h1 style="<%= css_for_mailer_heading %>">
+    <%= t("mailers.budget_investment_unselected.title") %>
+  </h1>
+
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.budget_investment_unselected.hi") %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.budget_investment_unselected.thanks") %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.budget_investment_unselected.sincerely") %>
   </p>
 </td>

app/views/mailer/comment.html.erb

@@ -1,30 +1,33 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
 
-  <h1 style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;">
+  <h1 style="<%= css_for_mailer_heading %>">
     <%= t("mailers.comment.title") %>
   </h1>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.comment.hi") %> <strong><%= @commentable.author.name %></strong>,
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= sanitize(t("mailers.comment.new_comment_by", commenter: @comment.author.name)) %>
-    <%= link_to @commentable.title, commentable_url(@commentable), style: "color: #2895F1; text-decoration:none;" %>
+    <%= link_to @commentable.title, commentable_url(@commentable), style: css_for_mailer_link %>
   </p>
 
-  <p style="border-left: 2px solid #DEE0E3;font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-style: italic;font-weight: normal;line-height: 24px;margin-left: 20px;padding: 10px;">
+  <div style="<%= css_for_mailer_text + css_for_mailer_quote %>">
-    <%= sanitize_and_auto_link @comment.body %>
+    <%= mailer_simple_format(@comment.body) %>
-  </p>
+  </div>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 12px;font-weight: normal;line-height: 20px;">
+  <p style="<%= css_for_mailer_text %>">
-    <%= sanitize(t("mailers.config.unsubscribe_text",
+    <%= sanitize(
-      notifications: link_to(
+      t("mailers.config.unsubscribe_text",
-        t("mailers.config.notifications_link"),
+        notifications: link_to(
-        edit_subscriptions_url(token: @token),
+          t("mailers.config.notifications_link"),
-        style: "color: #2895F1; text-decoration: none;"
+          edit_subscriptions_url(token: @token),
+          style: css_for_mailer_link
+        ),
+        notification: User.human_attribute_name(:email_on_comment)
       ),
-      notification: User.human_attribute_name(:email_on_comment)
+      attributes: %w[href style]
-    )) %>
+    ) %>
   </p>
 </td>

app/views/mailer/direct_message_for_receiver.html.erb

@@ -1,18 +1,17 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
-  <h1 style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;">
+  <h1 style="<%= css_for_mailer_heading %>">
     <%= @direct_message.title %>
   </h1>
 
-  <div style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <div style="<%= css_for_mailer_text %>">
-    <%= simple_format sanitize_and_auto_link(@direct_message.body), {}, sanitize: false %>
+    <%= mailer_simple_format(@direct_message.body) %>
   </div>
 
   <table style="width: 100%; border-top: 1px solid #DEE0E3; margin-top: 60px;">
     <tbody>
       <tr>
         <td style="padding-bottom: 12px; padding-top: 24px; text-align: center;">
-          <%= link_to user_url(@direct_message.sender), style: "font-family: 'Open Sans','Helvetica Neue',arial,sans-serif; background: #f7f5f2; border-radius: 6px; color: #3d3d66!important; font-weight: bold; margin: 0px; padding: 10px 15px; text-align: center; text-decoration: none; min-width: 200px; display: inline-block;", target: "_blank" do %>
+          <%= link_to user_url(@direct_message.sender), style: css_for_mailer_button, target: "_blank" do %>
-            <%= image_tag("icon_mailer_reply.png", style: "border: 0; display: inline-block; width: 100%; max-width: 12px; vertical-align: sub;", alt: "") %>
             <%= t("mailers.direct_message_for_receiver.reply",
                 sender: @direct_message.sender.name) %>
           <% end %>
@@ -21,18 +20,15 @@
     </tbody>
   </table>
 
-  <table style="width: 100%;">
+  <p style="<%= css_for_mailer_text %>">
-    <tbody>
+    <%= sanitize(
-      <tr>
+      t("mailers.direct_message_for_receiver.unsubscribe_text",
-        <td style="padding-left: 10px;">
+        notifications: link_to(
-          <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px; margin: 0; font-style: italic; padding-bottom: 20px;">
+          t("mailers.config.notifications_link"),
-            <%= sanitize(t("mailers.direct_message_for_receiver.unsubscribe_text",
+          edit_subscriptions_url(token: @token),
-                notifications: link_to(t("mailers.config.notifications_link"),
+          style: css_for_mailer_link)
-                                edit_subscriptions_url(token: @token),
+      ),
-                                style: "color: #2895F1; text-decoration: none;"))) %>
+      attributes: %w[href style]
-          </p>
+    ) %>
-        </td>
+  </p>
-      </tr>
-    </tbody>
-  </table>
 </td>

app/views/mailer/direct_message_for_sender.html.erb

@@ -1,15 +1,18 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif; font-size: 20px;">
+  <h1 style="<%= css_for_mailer_heading %>">
-    <%= sanitize(t("mailers.direct_message_for_sender.title",
+    <%= t("mailers.direct_message_for_sender.title") %>
-        receiver: @direct_message.receiver.name)) %>
+  </h1>
+
+  <p style="<%= css_for_mailer_text %>">
+    <%= sanitize(t("mailers.direct_message_for_sender.text", receiver: @direct_message.receiver.name)) %>
   </p>
 
-  <h2 style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif; font-size: 18px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= @direct_message.title %>
-  </h2>
+  </p>
 
-  <div style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <div style="<%= css_for_mailer_text %>">
-    <%= simple_format sanitize_and_auto_link(@direct_message.body), {}, sanitize: false %>
+    <%= mailer_simple_format(@direct_message.body) %>
   </div>
 </td>

app/views/mailer/email_verification.html.erb

@@ -1,21 +1,34 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
-  <h1 style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;">
+
+  <h1 style="<%= css_for_mailer_heading %>">
     <%= t("mailers.email_verification.title") %>
   </h1>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
-  <%= sanitize(t("mailers.email_verification.instructions",
+    <%= t("mailers.email_verification.text") %>
-        verification_link: link_to(
-          t("mailers.email_verification.click_here_to_verify"),
-          email_url(email_verification_token: @token)))) %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
-  <%= sanitize(t("mailers.email_verification.instructions_2",
+    <%= sanitize(
-        document_type: humanize_document_type(@document_type),
+      t("mailers.email_verification.instructions",
-        document_number: @document_number)) %>
+        verification_link: link_to(
+          t("mailers.email_verification.click_here_to_verify"),
+          email_url(email_verification_token: @token),
+          style: css_for_mailer_link)
+      ),
+      attributes: %w[href style]
+    ) %>
   </p>
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+
+  <p style="<%= css_for_mailer_text %>">
+    <%= sanitize(
+      t("mailers.email_verification.instructions_2",
+        document_type: humanize_document_type(@document_type),
+        document_number: @document_number)
+    ) %>
+  </p>
+
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.email_verification.thanks") %>
   </p>
 </td>

app/views/mailer/evaluation_comment.html.erb

@@ -1,23 +1,27 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
 
-  <h1 style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;">
+  <h1 style="<%= css_for_mailer_heading %>">
     <%= t("mailers.evaluation_comment.title", investment: @email.commentable.title) %>
   </h1>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.evaluation_comment.hi") %> <strong><%= @email_to.name %></strong>,
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
-    <%= sanitize(t(
+    <%= sanitize(
-      "mailers.evaluation_comment.new_comment_by",
+      t("mailers.evaluation_comment.new_comment_by",
-      commenter: @email.comment.author.name,
+        commenter: @email.comment.author.name,
-      investment: valuation_comments_link(@email.commentable)
+        investment: valuation_comments_link(@email.commentable)
-    )) %>
+      )
+    ) %>
   </p>
 
-  <%= t("mailers.evaluation_comment.commenter_info", commenter: @email.comment.author.name, time: l(@email.comment.created_at)) %>
+  <p style="<%= css_for_mailer_text %>">
-  <div style="border-left: 2px solid #DEE0E3;font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-style: italic;font-weight: normal;line-height: 24px;margin-left: 20px;padding: 10px;">
+    <%= t("mailers.evaluation_comment.commenter_info", commenter: @email.comment.author.name, time: l(@email.comment.created_at)) %>
-    <%= simple_format sanitize_and_auto_link(@email.comment.body), {}, sanitize: false %>
+  </p>
+
+  <div style="<%= css_for_mailer_text + css_for_mailer_quote %>">
+    <%= mailer_simple_format(@email.comment.body) %>
   </div>
 </td>

app/views/mailer/machine_learning_error.html.erb

@@ -1,17 +1,16 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
 
-  <h1 style="font-family: 'Open Sans','Helvetica Neue',sans-serif;">
+  <h1 style="<%= css_for_mailer_heading %>">
     <%= t("mailers.machine_learning_error.title") %>
   </h1>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;
+  <p style="<%= css_for_mailer_text %>">
-            font-weight: normal;line-height: 24px;">
     <%= t("mailers.machine_learning_error.text") %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;
+  <p style="<%= css_for_mailer_text %>">
-            font-weight: normal;line-height: 24px;">
+    <%= link_to t("mailers.machine_learning_error.link"),
-    <%= link_to t("mailers.machine_learning_error.link"), admin_machine_learning_url,
+                admin_machine_learning_url,
                 style: "color: #2895F1; text-decoration:none;" %>
   </p>
 </td>

app/views/mailer/machine_learning_success.html.erb

@@ -1,17 +1,16 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
 
-  <h1 style="font-family: 'Open Sans','Helvetica Neue',sans-serif;">
+  <h1 style="<%= css_for_mailer_heading %>">
     <%= t("mailers.machine_learning_success.title") %>
   </h1>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;
+  <p style="<%= css_for_mailer_text %>">
-            font-weight: normal;line-height: 24px;">
     <%= t("mailers.machine_learning_success.text") %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;
+  <p style="<%= css_for_mailer_text %>">
-            font-weight: normal;line-height: 24px;">
+    <%= link_to t("mailers.machine_learning_success.link"),
-    <%= link_to t("mailers.machine_learning_success.link"), admin_machine_learning_url,
+                admin_machine_learning_url,
                 style: "color: #2895F1; text-decoration:none;" %>
   </p>
 </td>

app/views/mailer/newsletter.html.erb

@@ -1,16 +1,20 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;line-height: 24px;">
+
+  <p style="<%= css_for_mailer_text %>">
     <%= auto_link_already_sanitized_html wysiwyg(@newsletter.body) %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 12px;font-weight: normal;line-height: 20px;">
+  <p style="<%= css_for_mailer_text %>">
-    <%= sanitize(t("mailers.config.unsubscribe_text",
+    <%= sanitize(
-      notifications: link_to(
+      t("mailers.config.unsubscribe_text",
-        t("mailers.config.notifications_link"),
+        notifications: link_to(
-        edit_subscriptions_url(token: @token),
+          t("mailers.config.notifications_link"),
-        style: "color: #2895F1; text-decoration: none;"
+          edit_subscriptions_url(token: @token),
+          style: css_for_mailer_link
+        ),
+        notification: User.human_attribute_name(:newsletter)
       ),
-      notification: User.human_attribute_name(:newsletter)
+      attributes: %w[href style]
-    )) %>
+    ) %>
   </p>
 </td>

app/views/mailer/proposal_notification_digest.html.erb

@@ -1,35 +1,29 @@
-<td>
+<td style="<%= css_for_mailer_content %>">
-  <table style="width: 100%;">
+
-    <tbody>
+  <h1 style="<%= css_for_mailer_heading %>">
-      <tr>
+    <%= t("mailers.proposal_notification_digest.title",
-        <td style="padding-left: 10px;">
+          org_name: Setting["org_name"]) %>
-          <h1 style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif; margin-bottom: 0;">
+  </h1>
-            <%= t("mailers.proposal_notification_digest.title",
+
-                  org_name: Setting["org_name"]) %>
+  <p style="<%= css_for_mailer_text %>">
-          </h1>
+    <%= t("mailers.proposal_notification_digest.info",
-          <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+          org_name: Setting["org_name"]) %>
-            <%= t("mailers.proposal_notification_digest.info",
+  </p>
-                  org_name: Setting["org_name"]) %>
-          </p>
-        </td>
-      </tr>
-    </tbody>
-  </table>
 
   <% @notifications.each do |notification| %>
     <table style="width: 100%; border-top: 1px solid #DEE0E3; padding-top: 12px;">
       <tbody>
         <tr>
           <td style="padding-bottom: 20px; padding-left: 10px;">
-            <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 20px;font-weight: bold;line-height: 24px; margin: 0;">
+            <h2 style="<%= css_for_mailer_subheading %>">
-              <%= link_to notification.notifiable.title, proposal_url(notification.notifiable.proposal, anchor: "tab-notifications"), style: "color: #2895F1; text-decoration: none;" %>
+              <%= link_to notification.notifiable.title, proposal_url(notification.notifiable.proposal, anchor: "tab-notifications"), style: css_for_mailer_link %>
-            </p>
+            </h2>
-            <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px; margin-top: 0; color: #cccccc;">
+            <p style="<%= css_for_mailer_text %>">
               <%= notification.notifiable.proposal.title %>&nbsp;&bull;&nbsp;
               <%= notification.notifiable.proposal.created_at.to_date %>&nbsp;&bull;&nbsp;
               <%= notification.notifiable.proposal.author.name %>
             </p>
-            <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+            <p style="<%= css_for_mailer_text %>">
               <%= notification.notifiable.body %>
             </p>
 
@@ -37,23 +31,26 @@
               <tbody>
                 <tr>
                   <td style="padding-bottom: 12px;">
-                    <%= link_to proposal_url(notification.notifiable.proposal, anchor: "social-share"), style: "font-family: 'Open Sans','Helvetica Neue',arial,sans-serif; background: #f7f5f2; border-radius: 6px; color: #3d3d66!important; font-weight: bold; margin: 0px; padding: 10px 15px; text-align: center; text-decoration: none; min-width: 160px; display: inline-block;" do %>
+                    <%= link_to proposal_url(notification.notifiable.proposal, anchor: "social-share"), style: css_for_mailer_button do %>
-                      <%= image_tag("icon_mailer_share.png", style: "border: 0; display: inline-block; width: 100%; max-width: 16px", alt: "") %>
                       <%= t("mailers.proposal_notification_digest.share") %>
                     <% end %>
 
-                    <%= link_to proposal_url(notification.notifiable.proposal, anchor: "comments"), style: "font-family: 'Open Sans','Helvetica Neue',arial,sans-serif; background: #f7f5f2; border-radius: 6px; color: #3d3d66!important; font-weight: bold; margin: 0px; padding: 10px 15px; text-align: center; text-decoration: none; min-width: 160px; display: inline-block; margin-left: 12px;" do %>
+                    <%= link_to proposal_url(notification.notifiable.proposal, anchor: "comments"), style: css_for_mailer_button do %>
-                      <%= image_tag("icon_mailer_comment.png", style: "border: 0; display: inline-block; width: 100%; max-width: 16px; vertical-align: middle;", alt: "") %>
                       <%= t("mailers.proposal_notification_digest.comment") %>
                     <% end %>
                   </td>
                 </tr>
                 <tr>
                   <td>
-                    <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px; margin: 0; padding-bottom: 20px;">
+                    <p style="<%= css_for_mailer_text %>">
-                      <%= sanitize(link_to(t("mailers.proposal_notification_digest.unfollow"),
+                      <%= sanitize(
+                        link_to(
+                          t("mailers.proposal_notification_digest.unfollow"),
                           proposal_url(notification.notifiable.proposal),
-                          style: "color: #2895F1; text-decoration: none;")) %>
+                          style: css_for_mailer_link
+                        ),
+                        attributes: %w[href style]
+                      ) %>
                     </p>
                   </td>
                 </tr>
@@ -65,18 +62,15 @@
     </table>
   <% end %>
 
-  <table style="width: 100%;">
+  <p style="<%= css_for_mailer_text %>">
-    <tbody>
+    <%= sanitize(
-      <tr>
+      t("mailers.proposal_notification_digest.unsubscribe_text",
-        <td style="padding-left: 10px;">
+        notifications: link_to(
-          <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px; margin: 0; font-style: italic; padding-bottom: 20px;">
+          t("mailers.config.notifications_link"),
-            <%= sanitize(t("mailers.proposal_notification_digest.unsubscribe_text",
+          edit_subscriptions_url(token: @token),
-                notifications: link_to(t("mailers.config.notifications_link"),
+          style: css_for_mailer_link)
-                                edit_subscriptions_url(token: @token),
+        ),
-                                style: "color: #2895F1; text-decoration: none;"))) %>
+      attributes: %w[href style]
-          </p>
+    ) %>
-        </td>
+  </p>
-      </tr>
-    </tbody>
-  </table>
 </td>

app/views/mailer/reply.html.erb

@@ -1,30 +1,33 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
 
-  <h1 style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;">
+  <h1 style="<%= css_for_mailer_heading %>">
     <%= t("mailers.reply.title") %>
   </h1>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.reply.hi") %> <strong><%= @email.recipient.name %></strong>,
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= sanitize(t("mailers.reply.new_reply_by", commenter: @email.reply.author.name)) %>
-    <%= link_to @email.commentable.title, comment_url(@email.reply.id), style: "color: #2895F1; text-decoration:none;" %>
+    <%= link_to @email.commentable.title, comment_url(@email.reply.id), style: css_for_mailer_link %>
   </p>
 
-  <div style="border-left: 2px solid #DEE0E3;font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-style: italic;font-weight: normal;line-height: 24px;margin-left: 20px;padding: 10px;">
+  <div style="<%= css_for_mailer_text + css_for_mailer_quote %>">
-    <%= simple_format sanitize_and_auto_link(@email.reply.body), {}, sanitize: false %>
+    <%= mailer_simple_format(@email.reply.body) %>
   </div>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 12px;font-weight: normal;line-height: 20px;">
+  <p style="<%= css_for_mailer_text %>">
-    <%= sanitize(t("mailers.config.unsubscribe_text",
+    <%= sanitize(
-      notifications: link_to(
+      t("mailers.config.unsubscribe_text",
-        t("mailers.config.notifications_link"),
+        notifications: link_to(
-        edit_subscriptions_url(token: @token),
+          t("mailers.config.notifications_link"),
-        style: "color: #2895F1; text-decoration: none;"
+          edit_subscriptions_url(token: @token),
+          style: css_for_mailer_link
+        ),
+        notification: User.human_attribute_name(:email_on_comment_reply)
       ),
-      notification: User.human_attribute_name(:email_on_comment_reply)
+      attributes: %w[href style]
-    )) %>
+    ) %>
   </p>
 </td>

app/views/mailer/user_invite.html.erb

@@ -1,23 +1,23 @@
-<td style="padding-bottom: 20px; padding-left: 10px;">
+<td style="<%= css_for_mailer_content %>">
-  <h1 style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;">
+  <h1 style="<%= css_for_mailer_heading %>">
     <%= t("mailers.user_invite.title",
         org: Setting["org_name"]) %>
   </h1>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.user_invite.text",
         org: Setting["org_name"]) %>
   </p>
 
   <p style="text-align: center;">
-    <%= link_to t("mailers.user_invite.button"), new_user_registration_url, style: "font-family: 'Open Sans','Helvetica Neue',arial,sans-serif; background: #004A83; border-radius: 6px; color: #fff !important; font-weight: bold; margin: 0px; padding: 10px 15px; text-align: center; text-decoration: none; min-width: 160px; display: inline-block; margin-left: 12px;" %>
+    <%= link_to t("mailers.user_invite.button"), new_user_registration_url, style: css_for_mailer_button %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.user_invite.ignore") %>
   </p>
 
-  <p style="font-family: 'Open Sans','Helvetica Neue',arial,sans-serif;font-size: 14px;font-weight: normal;line-height: 24px;">
+  <p style="<%= css_for_mailer_text %>">
     <%= t("mailers.user_invite.thanks") %>
   </p>
 </td>

config/locales/en/mailers.yml

@@ -20,7 +20,8 @@ en:
       instructions: To complete the verification of your user account you must click %{verification_link}.
       subject: Confirm your email
       thanks: Thank you very much.
-      title: Confirm your account using the following link
+      title: "Confirm your email"
+      text: "Confirm your account using the following link."
     reply:
       hi: Hi
       new_reply_by: There is a new response from <strong>%{commenter}</strong> to your comment on
@@ -39,7 +40,8 @@ en:
       unsubscribe_text: "If you don't want to receive direct messages, visit %{notifications} and uncheck 'Receive emails about direct messages'."
     direct_message_for_sender:
       subject: "You have sent a new private message"
-      title: "You have sent a new private message to <strong>%{receiver}</strong> with the content:"
+      title: "You have sent a new private message"
+      text: "You have sent a new private message to <strong>%{receiver}</strong> with the content:"
     user_invite:
       ignore: "If you have not requested this invitation don't worry, you can ignore this email."
       text: "Thank you for applying to join %{org}! In seconds you can start to participate, just fill the form below:"
@@ -57,6 +59,7 @@ en:
       sincerely: "Sincerely,"
       share: "Share your project"
     budget_investment_unfeasible:
+      title: "Your investment project has been marked as unfeasible"
       hi: "Dear user,"
       new: "For all these, we invite you to elaborate a <strong>new investment</strong> that adjusts to the conditions of this process. You can do it following this link: %{url}."
       new_href: "new investment project"
@@ -65,6 +68,7 @@ en:
       subject: "Your investment project '%{code}' has been marked as unfeasible"
     budget_investment_selected:
       subject: "Your investment project '%{code}' has been selected"
+      title: "Your investment project has been selected"
       hi: "Dear user,"
       share: "Start to get votes, share your investment project on social networks. Share is essential to make it a reality."
       share_button: "Share your investment project"
@@ -72,6 +76,7 @@ en:
       sincerely: "Sincererly"
     budget_investment_unselected:
       subject: "Your investment project '%{code}' has not been selected"
+      title: "Your investment project has not been selected"
       hi: "Dear user,"
       thanks: "Thank you again for participating."
       sincerely: "Sincererly"

config/locales/es/mailers.yml

@@ -20,7 +20,8 @@ es:
       instructions: Para terminar de verificar tu cuenta de usuario pulsa %{verification_link}.
       subject: Verifica tu email
       thanks: Muchas gracias.
-      title: Verifica tu cuenta con el siguiente enlace
+      title: "Verifica tu email"
+      text: "Verifica tu cuenta con el siguiente enlace."
     reply:
       hi: Hola
       new_reply_by: Hay una nueva respuesta de <strong>%{commenter}</strong> a tu comentario en
@@ -39,7 +40,8 @@ es:
       unsubscribe_text: "Si no quieres recibir mensajes privados, puedes entrar en %{notifications} y desmarcar la opción 'Recibir emails con mensajes privados'."
     direct_message_for_sender:
       subject: "Has enviado un nuevo mensaje privado"
-      title: "Has enviado un nuevo mensaje privado a <strong>%{receiver}</strong> con el siguiente contenido:"
+      title: "Has enviado un nuevo mensaje privado"
+      text: "Has enviado un nuevo mensaje privado a <strong>%{receiver}</strong> con el siguiente contenido:"
     user_invite:
       ignore: "Si no has solicitado esta invitación no te preocupes, puedes ignorar este correo."
       text: "¡Gracias por solicitar unirte a %{org}! En unos segundos podrás empezar a participar, sólo tienes que rellenar el siguiente formulario:"
@@ -57,6 +59,7 @@ es:
       sincerely: "Atentamente,"
       share: "Comparte tu proyecto"
     budget_investment_unfeasible:
+      title: "Tu proyecto de gasto ha sido marcado como inviable"
       hi: "Estimado/a usuario/a"
       new: "Por todo ello, te invitamos a que elabores un <strong>nuevo proyecto de gasto</strong> que se ajuste a las condiciones de este proceso. Esto lo puedes hacer en este enlace: %{url}."
       new_href: "nuevo proyecto de gasto"
@@ -65,6 +68,7 @@ es:
       subject: "Tu proyecto de gasto '%{code}' ha sido marcado como inviable"
     budget_investment_selected:
       subject: "Tu proyecto de gasto '%{code}' ha sido seleccionado"
+      title: "Tu proyecto de gasto ha sido seleccionado"
       hi: "Estimado/a usuario/a"
       share: "Empieza ya a conseguir votos, comparte tu proyecto de gasto en redes sociales. La difusión es fundamental para conseguir que se haga realidad."
       share_button: "Comparte tu proyecto"
@@ -72,6 +76,7 @@ es:
       sincerely: "Atentamente"
     budget_investment_unselected:
       subject: "Tu proyecto de gasto '%{code}' no ha sido seleccionado"
+      title: "Tu proyecto de gasto no ha sido seleccionado"
       hi: "Estimado/a usuario/a"
       thanks: "Gracias de nuevo por tu participación."
       sincerely: "Atentamente"

spec/system/admin/system_emails_spec.rb

@@ -251,25 +251,36 @@ describe "System Emails" do
       expect(page).to have_content "Some example data is needed in order to preview the email."
     end
 
-    scenario "#evaluation_comment" do
+    describe "#evaluation_comment" do
-      admin = create(:administrator, user: create(:user, username: "Baby Doe"))
+      scenario "render correctly evaluaton comment mailer with valuator as a sample user" do
-      investment = create(:budget_investment,
+        admin = create(:administrator, user: create(:user, username: "Baby Doe"))
-        title: "Cleaner city",
+        investment = create(:budget_investment,
-        heading: heading,
+          title: "Cleaner city",
-        author: user,
+          heading: heading,
-        administrator: admin)
+          author: user,
-      comment = create(:comment, :valuation, commentable: investment)
+          administrator: admin)
+        comment = create(:comment, :valuation, commentable: investment)
 
-      visit admin_system_email_view_path("evaluation_comment")
+        visit admin_system_email_view_path("evaluation_comment")
 
-      expect(page).to have_content "New evaluation comment for Cleaner city"
+        expect(page).to have_content "New evaluation comment for Cleaner city"
-      expect(page).to have_content "Hi #{admin.name}"
+        expect(page).to have_content "Hi #{admin.name}"
-      expect(page).to have_content "There is a new evaluation comment from #{comment.user.name} "\
+        expect(page).to have_content "There is a new evaluation comment from #{comment.user.name} "\
-                                   "to the budget investment Cleaner city"
+                                     "to the budget investment Cleaner city"
-      expect(page).to have_content comment.body
+        expect(page).to have_content comment.body
 
-      expect(page).to have_link "Cleaner city",
+        expect(page).to have_link "Cleaner city",
-        href: admin_budget_budget_investment_url(investment.budget, investment, anchor: "comments", host: app_host)
+          href: admin_budget_budget_investment_url(investment.budget, investment, anchor: "comments", host: app_host)
+      end
+
+      scenario "uses a current_user as a sample user for sample regular comments" do
+        create(:budget_investment_comment, body: "This is a sample comment")
+
+        visit admin_system_email_view_path("evaluation_comment")
+
+        expect(page).to have_content "This is a sample comment"
+        expect(page).to have_content admin.name
+      end
     end
   end