From 2c612f644813290257e5ae0ebf8d8d8533c9e22a Mon Sep 17 00:00:00 2001
From: Pierre de La Morinerie <kemenaran@gmail.com>
Date: Mon, 22 Jul 2019 15:11:03 +0200
Subject: [PATCH] helpers: add variants to mailer_round_button

---
 app/helpers/mailer_helper.rb                  | 23 +++++++++++++++++--
 .../notify_new_answer.html.haml               |  2 +-
 .../shared/_mailer_round_button.html.haml     | 11 +++++----
 3 files changed, 28 insertions(+), 8 deletions(-)

diff --git a/app/helpers/mailer_helper.rb b/app/helpers/mailer_helper.rb
index 28767841d..3c0bd9f55 100644
--- a/app/helpers/mailer_helper.rb
+++ b/app/helpers/mailer_helper.rb
@@ -1,5 +1,24 @@
 module MailerHelper
-  def round_button(text, url)
-    render 'shared/mailer_round_button', text: text, url: url
+  def round_button(text, url, variant)
+    render 'shared/mailer_round_button', text: text, url: url, theme: theme(variant)
+  end
+
+  private
+
+  def theme(variant)
+    case variant
+    when :primary
+      { color: white, bg_color: blue, border_color: blue }
+    when :secondary
+      { color: blue, bg_color: white, border_color: blue }
+    end
+  end
+
+  def blue
+    '#0069CC'
+  end
+
+  def white
+    '#FFFFFF'
   end
 end
diff --git a/app/views/dossier_mailer/notify_new_answer.html.haml b/app/views/dossier_mailer/notify_new_answer.html.haml
index 3e0195afe..a1b910b82 100644
--- a/app/views/dossier_mailer/notify_new_answer.html.haml
+++ b/app/views/dossier_mailer/notify_new_answer.html.haml
@@ -11,7 +11,7 @@
 %p
   Pour le consulter et y répondre, cliquez sur le bouton ci-dessous :
 
-= round_button('Lire le message', messagerie_dossier_url(@dossier))
+= round_button('Lire le message', messagerie_dossier_url(@dossier), :primary)
 
 = render 'layouts/mailers/signature', service: @service
 
diff --git a/app/views/shared/_mailer_round_button.html.haml b/app/views/shared/_mailer_round_button.html.haml
index c983e0bdc..012479f2f 100644
--- a/app/views/shared/_mailer_round_button.html.haml
+++ b/app/views/shared/_mailer_round_button.html.haml
@@ -1,9 +1,10 @@
 /# From https://litmus.com/blog/a-guide-to-bulletproof-buttons-in-email-design
-%table{ width: "100%", border: "0", cellspacing:"0", cellpadding:"0" }
+%table{ width: "100%", border: "0", cellspacing:"0", cellpadding:"5" }
   %tr
-    %td
-      %table{ border:"0", cellspacing:"0", cellpadding:"0", style:"margin: auto" }
+    %td{ align: "center" }
+      %table{ border:"0", cellspacing:"0", cellpadding:"0" }
         %tr
-          %td{ align:"center", style:"border-radius: 5px;", bgcolor:"#0069cc" }
-            %a{ href: url, target:"_blank", rel: "noopener", style:"font-size: 16px; font-family: Helvetica, Arial, sans-serif; color: #ffffff; text-decoration: none; text-decoration: none; border-radius: 5px; padding: 12px 25px; border: 1px solid #0069cc; display: inline-block;" }
+          %td{ align:"center", style:"border-radius: 5px;", color: theme[:color], bgcolor: theme[:bg_color] }
+            %a{ href: url, target:"_blank", rel: "noopener", style:"font-size: 16px; font-family: Helvetica, Arial, sans-serif; color: #{theme[:color]}; text-decoration: none; text-decoration: none; border-radius: 5px; padding: 12px 25px; border: 1px solid #{theme[:border_color]}; display: inline-block; min-width: 250px" }
               = text
+