From d92e1fdd4d8afbf15f11c0f46e74ab0c9d440200 Mon Sep 17 00:00:00 2001
From: FORESTIER Fabien <fabien.forestier@soprasteria.com>
Date: Mon, 18 Feb 2019 09:20:52 +0100
Subject: [PATCH] Update contact email template
---
package-lock.json | 11 +-
package.json | 1 +
src/configuration/config.ts | 1 +
.../contact/contact-admin.html | 23 +++-
.../contact/contact-admin.mjml | 81 +++++++++----
src/email-templates/contact/contact-user.html | 23 +++-
src/email-templates/contact/contact-user.mjml | 109 ++++++++++++------
src/email-templates/contact/index.ts | 51 +++++++-
src/email/email.service.ts | 6 +
9 files changed, 229 insertions(+), 77 deletions(-)
diff --git a/package-lock.json b/package-lock.json
index b252864..754579a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -4420,9 +4420,9 @@
"dev": true
},
"handlebars": {
- "version": "4.0.12",
- "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.0.12.tgz",
- "integrity": "sha512-RhmTekP+FZL+XNhwS1Wf+bTTZpdLougwt5pcgA1tuz6Jcx0fpH/7z0qd71RKnZHBCxIRBHfBOnio4gViPemNzA==",
+ "version": "4.1.0",
+ "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.1.0.tgz",
+ "integrity": "sha512-l2jRuU1NAWK6AW5qqcTATWQJvNPEwkM7NEKSiv/gqOsoSQbVoWyqVEY5GS+XPQ88zLNmqASRpzfdm8d79hJS+w==",
"dev": true,
"requires": {
"async": "^2.5.0",
@@ -6152,6 +6152,11 @@
"minimist": "0.0.8"
}
},
+ "moment": {
+ "version": "2.24.0",
+ "resolved": "https://registry.npmjs.org/moment/-/moment-2.24.0.tgz",
+ "integrity": "sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg=="
+ },
"move-concurrently": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/move-concurrently/-/move-concurrently-1.0.1.tgz",
diff --git a/package.json b/package.json
index 5c86fc8..a4b40f7 100644
--- a/package.json
+++ b/package.json
@@ -26,6 +26,7 @@
"amqplib": "^0.5.2",
"class-transformer": "^0.1.9",
"class-validator": "^0.9.1",
+ "moment": "^2.24.0",
"reflect-metadata": "^0.1.12",
"rxjs": "^6.2.2",
"typescript": "^3.0.1"
diff --git a/src/configuration/config.ts b/src/configuration/config.ts
index 04375b1..e657524 100644
--- a/src/configuration/config.ts
+++ b/src/configuration/config.ts
@@ -7,4 +7,5 @@ export const config = {
},
mailerQueue: 'portail-data-send-email',
plateformDataEmail: '',
+ imageHost: 'https://highway-to-data.alpha.grandlyon.com/email-template-assets',
};
\ No newline at end of file
diff --git a/src/email-templates/contact/contact-admin.html b/src/email-templates/contact/contact-admin.html
index c2b14df..94fa5da 100644
--- a/src/email-templates/contact/contact-admin.html
+++ b/src/email-templates/contact/contact-admin.html
@@ -1,4 +1,4 @@
-<!doctype html><html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office"><head><title>Contact</title><!--[if !mso]><!-- --><meta http-equiv="X-UA-Compatible" content="IE=edge"><!--<![endif]--><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><style type="text/css">#outlook a { padding:0; }
+<!doctype html><html lang="fr" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office"><head><title>Contact</title><!--[if !mso]><!-- --><meta http-equiv="X-UA-Compatible" content="IE=edge"><!--<![endif]--><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><style type="text/css">#outlook a { padding:0; }
.ReadMsgBody { width:100%; }
.ExternalClass { width:100%; }
.ExternalClass * { line-height:100%; }
@@ -21,8 +21,25 @@
</style>
<![endif]--><!--[if !mso]><!--><link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet" type="text/css"><style type="text/css">@import url(https://fonts.googleapis.com/css?family=Lato);</style><!--<![endif]--><style type="text/css">@media only screen and (min-width:480px) {
.mj-column-per-100 { width:100% !important; max-width: 100%; }
+.mj-column-per-50 { width:50% !important; max-width: 50%; }
}</style><style type="text/css">@media only screen and (max-width:480px) {
table.full-width-mobile { width: 100% !important; }
td.full-width-mobile { width: auto !important; }
- }</style></head><body><div><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="Margin:0px auto;max-width:600px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;"><tbody><tr><td style="border:1px solid #ccc;direction:ltr;font-size:0px;padding:0px 0px;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" width="600px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:598px;" width="598" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:white;background-color:white;Margin:0px auto;max-width:598px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:white;background-color:white;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:598px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;"><tbody><tr><td style="width:250px;"><img height="auto" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/datagrandlyoncom.png" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;" width="250"></td></tr></tbody></table></td></tr><tr><td style="font-size:0px;padding:10px 25px;word-break:break-word;"><p style="border-top:solid 4px #ed1c24;font-size:1;margin:0px auto;width:100%;"></p><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" style="border-top:solid 4px #ed1c24;font-size:1;margin:0px auto;width:548px;" role="presentation" width="548px" ><tr><td style="height:0;line-height:0;">
-</td></tr></table><![endif]--></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">Une demande de contact a récemment été déposée par l'utilisateur ${options.firstName} ${options.lastName}.</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;text-decoration:underline;color:#000000;">Email:</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;padding-left:40px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">${options.email}</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;text-decoration:underline;color:#000000;">Sujet:</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;padding-left:40px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">${options.subject}</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;text-decoration:underline;color:#000000;">Message:</div></td></tr><tr><td align="left" class="pre" style="white-space: pre; font-size: 0px; padding: 10px 25px; padding-left: 40px; word-break: break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">${options.message}</div></td></tr></table></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr><tr><td class="" width="600px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:598px;" width="598" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:#ed1c24;background-color:#ed1c24;Margin:0px auto;max-width:598px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#ed1c24;background-color:#ed1c24;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:598px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;"><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" ><tr><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:4px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:25px;"><tr><td style="font-size:0;height:25px;vertical-align:middle;width:25px;"><a href="https://download.data.grandlyon.com/catalogue/srv/fre/rss.search?sortBy=publicationDate&georss=simplepoint&data" target="_blank"><img height="25" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/rss.png" style="border-radius:3px;" width="25"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:4px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:25px;"><tr><td style="font-size:0;height:25px;vertical-align:middle;width:25px;"><a href="http://www.facebook.com/legrandlyon" target="_blank"><img height="25" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/facebook.png" style="border-radius:3px;" width="25"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:4px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:25px;"><tr><td style="font-size:0;height:25px;vertical-align:middle;width:25px;"><a href="https://twitter.com/grandlyon" target="_blank"><img height="25" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/twitter.png" style="border-radius:3px;" width="25"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></table></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table><![endif]--></div></body></html>
\ No newline at end of file
+ }</style><style type="text/css">.warn-message {
+ color: "white";
+ }
+
+ .link {
+ color: white;
+ font-weight: bold;
+ }
+
+ .pre {
+ white-space: pre;
+ }
+
+ @media (max-width:480px) {
+ .title {
+ padding: 7% 10% !important;
+ }
+ }</style></head><body><div class="body"><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:800px;" width="800" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="Margin:0px auto;max-width:800px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:0;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" width="800px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:800px;" width="800" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:#333744;background-color:#333744;Margin:0px auto;max-width:800px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#333744;background-color:#333744;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:3% 6%;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="width:788px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:0;line-height:0;text-align:left;display:inline-block;width:100%;direction:ltr;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td style="vertical-align:top;width:394px;" ><![endif]--><div class="mj-column-per-50 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:50%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="left" style="font-size:0px;padding:0;word-break:break-word;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;"><tbody><tr><td style="width:130px;"><img alt="Logo data.grandlyon.com" height="auto" src="${options.imageHost}/logo_data_neg.png" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;" width="130"></td></tr></tbody></table></td></tr></table></div><!--[if mso | IE]></td><td style="vertical-align:top;width:394px;" ><![endif]--><div class="mj-column-per-50 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:50%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="right" style="font-size:0px;padding:0;word-break:break-word;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;"><tbody><tr><td style="width:80px;"><img alt="Logo Grand Lyon" height="auto" src="${options.imageHost}/logo_gl_négatif.png" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;" width="80"></td></tr></tbody></table></td></tr></table></div><!--[if mso | IE]></td></tr></table><![endif]--></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr><tr><td class="" width="800px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:800px;" width="800" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:#f2f2f2;background-color:#f2f2f2;Margin:0px auto;max-width:800px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#f2f2f2;background-color:#f2f2f2;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:3% 6%;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:788px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%"><tbody><tr><td style="background-color:white;vertical-align:top;padding:3% 6%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%"><tr><td align="center" class="title" style="font-size:0px;padding:3% 10%;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:18px;font-weight:bold;line-height:18px;text-align:center;color:#333744;">Contact</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:left;color:#333744;">Une demande de contact a été déposée le ${options.datetime} par l'utilisateur ${options.firstName} ${options.lastName}.</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:left;color:#333744;">Voici un résumé de la demande :</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-weight:bold;line-height:18px;text-align:left;color:#333744;">Email:</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-style:italic;line-height:18px;text-align:left;color:#333744;">${options.email}</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-weight:bold;line-height:18px;text-align:left;color:#333744;">Sujet:</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-style:italic;line-height:18px;text-align:left;color:#333744;">${options.subject}</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-weight:bold;line-height:18px;text-align:left;color:#333744;">Message:</div></td></tr><tr><td align="left" class="pre" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-style:italic;line-height:18px;text-align:left;color:#333744;">${options.message}</div></td></tr><tr><td align="right" style="font-size:0px;padding:3% 0 0 0;padding-top:3%;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:right;color:#333744;">L'équipe data.grandlyon.com</div></td></tr><tr><td align="right" style="font-size:0px;padding:10px 25px;padding-top:1%;padding-right:0;word-break:break-word;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;"><tbody><tr><td style="width:105px;"><img alt="Logo data.grandlyon.com" height="auto" src="${options.imageHost}/logo_data.png" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;" width="105"></td></tr></tbody></table></td></tr></table></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr><tr><td class="" width="800px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:800px;" width="800" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:#333744;background-color:#333744;Margin:0px auto;max-width:800px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#333744;background-color:#333744;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:3% 6%;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:788px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="center" style="font-size:0px;padding:0;word-break:break-word;"><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" ><tr><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:0 5px 0 5px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:16px;"><tr><td style="font-size:0;height:16px;vertical-align:middle;width:16px;"><a href="https://download.data.grandlyon.com/catalogue/srv/fre/rss.search?sortBy=publicationDate&georss=simplepoint&data" target="_blank"><img alt="Logo rss" height="16" src="${options.imageHost}/logo_rss.png" style="border-radius:3px;" width="16"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:0 5px 0 5px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:16px;"><tr><td style="font-size:0;height:16px;vertical-align:middle;width:16px;"><a href="http://www.facebook.com/legrandlyon" target="_blank"><img alt="Logo Facebook" height="16" src="${options.imageHost}/logo_fb.png" style="border-radius:3px;" width="16"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:0 5px 0 5px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:16px;"><tr><td style="font-size:0;height:16px;vertical-align:middle;width:16px;"><a href="https://twitter.com/grandlyon" target="_blank"><img alt="Logo Twitter" height="16" src="${options.imageHost}/logo_twi.png" style="border-radius:3px;" width="16"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></table></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table><![endif]--></div></body></html>
\ No newline at end of file
diff --git a/src/email-templates/contact/contact-admin.mjml b/src/email-templates/contact/contact-admin.mjml
index 6569e1d..4a2f82a 100644
--- a/src/email-templates/contact/contact-admin.mjml
+++ b/src/email-templates/contact/contact-admin.mjml
@@ -1,61 +1,94 @@
-<mjml>
+<mjml lang="fr">
<mj-head>
<mj-title>Contact</mj-title>
<mj-font name="Lato" href="https://fonts.googleapis.com/css?family=Lato" />
<mj-attributes>
- <mj-text font-family="Lato" line-height="25px" font-size="16px" />
+ <mj-text font-family="Lato, sans-serif" line-height="18px" font-size="14px" padding="3% 0 0 0" color="#333744"></mj-text>
+ <mj-social-element padding="0 5px 0 5px"></mj-social-element>
</mj-attributes>
- <mj-style inline="inline">
+ <mj-style>
+ .warn-message {
+ color: "white";
+ }
+
+ .link {
+ color: white;
+ font-weight: bold;
+ }
+
.pre {
white-space: pre;
}
+
+ @media (max-width:480px) {
+ .title {
+ padding: 7% 10% !important;
+ }
+ }
</mj-style>
</mj-head>
- <mj-body>
- <mj-wrapper border="1px solid #ccc" padding="0px 0px">
- <mj-section background-color="white">
- <mj-column>
-
- <mj-image width="250px" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/datagrandlyoncom.png"></mj-image>
-
- <mj-divider border-color="#ed1c24"></mj-divider>
-
- <mj-text>Une demande de contact a récemment été déposée par l'utilisateur ${options.firstName} ${options.lastName}.</mj-text>
+ <mj-body width="800px" css-class="body">
+ <mj-wrapper padding="0">
+ <mj-section background-color="#333744" padding="3% 6%">
+ <mj-group>
+ <mj-column>
+ <mj-image width="130px" align="left" padding="0" alt="Logo data.grandlyon.com" src="${options.imageHost}/logo_data_neg.png"></mj-image>
+ </mj-column>
+ <mj-column>
+ <mj-image width="80px" align="right" padding="0" alt="Logo Grand Lyon" src="${options.imageHost}/logo_gl_négatif.png"></mj-image>
+ </mj-column>
+ </mj-group>
+ </mj-section>
- <mj-text text-decoration="underline">
+ <mj-section background-color="#f2f2f2" padding="3% 6%">
+ <mj-column background-color="white" padding="3% 6%">
+ <mj-text align="center" css-class="title" font-size="18px" font-weight="bold" padding="3% 10%">
+ Contact
+ </mj-text>
+ <mj-text>
+ Une demande de contact a été déposée le ${options.datetime} par l'utilisateur ${options.firstName} ${options.lastName}.
+ </mj-text>
+
+ <mj-text>
+ Voici un résumé de la demande :
+ </mj-text>
+ <mj-text font-weight="bold">
Email:
</mj-text>
- <mj-text padding-left="40px">
+ <mj-text font-style="italic">
${options.email}
</mj-text>
- <mj-text text-decoration="underline">
+ <mj-text font-weight="bold">
Sujet:
</mj-text>
- <mj-text padding-left="40px">${options.subject}</mj-text>
+ <mj-text font-style="italic">${options.subject}</mj-text>
- <mj-text text-decoration="underline">
+ <mj-text font-weight="bold">
Message:
</mj-text>
- <mj-text padding-left="40px" css-class="pre">
+ <mj-text css-class="pre" font-style="italic">
${options.message}
</mj-text>
+ <mj-text align="right" padding-top="3%">
+ L'équipe data.grandlyon.com
</mj-text>
+ <mj-image align="right" width="105px" padding-right="0" padding-top="1%" alt="Logo data.grandlyon.com" src="${options.imageHost}/logo_data.png"></mj-image>
</mj-column>
</mj-section>
- <mj-section background-color="#ed1c24">
+ <mj-section background-color="#333744" padding="3% 6%">
<mj-column>
- <mj-social font-size="15px" icon-size="25px" mode="horizontal">
- <mj-social-element href="https://download.data.grandlyon.com/catalogue/srv/fre/rss.search?sortBy=publicationDate&georss=simplepoint&data" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/rss.png">
+ <mj-social padding="0" font-size="15px" icon-size="16px" mode="horizontal">
+ <mj-social-element alt="Logo rss" href="https://download.data.grandlyon.com/catalogue/srv/fre/rss.search?sortBy=publicationDate&georss=simplepoint&data" src="${options.imageHost}/logo_rss.png">
</mj-social-element>
- <mj-social-element href="http://www.facebook.com/legrandlyon" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/facebook.png">
+ <mj-social-element alt="Logo Facebook" href="http://www.facebook.com/legrandlyon" src="${options.imageHost}/logo_fb.png">
</mj-social-element>
- <mj-social-element href="https://twitter.com/grandlyon" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/twitter.png">
+ <mj-social-element alt="Logo Twitter" href="https://twitter.com/grandlyon" src="${options.imageHost}/logo_twi.png">
</mj-social-element>
</mj-social>
</mj-column>
diff --git a/src/email-templates/contact/contact-user.html b/src/email-templates/contact/contact-user.html
index 2da894e..f75a1d2 100644
--- a/src/email-templates/contact/contact-user.html
+++ b/src/email-templates/contact/contact-user.html
@@ -1,4 +1,4 @@
-<!doctype html><html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office"><head><title>Contact</title><!--[if !mso]><!-- --><meta http-equiv="X-UA-Compatible" content="IE=edge"><!--<![endif]--><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><style type="text/css">#outlook a { padding:0; }
+<!doctype html><html lang="fr" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office"><head><title>Contact</title><!--[if !mso]><!-- --><meta http-equiv="X-UA-Compatible" content="IE=edge"><!--<![endif]--><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><style type="text/css">#outlook a { padding:0; }
.ReadMsgBody { width:100%; }
.ExternalClass { width:100%; }
.ExternalClass * { line-height:100%; }
@@ -21,8 +21,25 @@
</style>
<![endif]--><!--[if !mso]><!--><link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet" type="text/css"><style type="text/css">@import url(https://fonts.googleapis.com/css?family=Lato);</style><!--<![endif]--><style type="text/css">@media only screen and (min-width:480px) {
.mj-column-per-100 { width:100% !important; max-width: 100%; }
+.mj-column-per-50 { width:50% !important; max-width: 50%; }
}</style><style type="text/css">@media only screen and (max-width:480px) {
table.full-width-mobile { width: 100% !important; }
td.full-width-mobile { width: auto !important; }
- }</style></head><body><div><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="Margin:0px auto;max-width:600px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;"><tbody><tr><td style="border:1px solid #ccc;direction:ltr;font-size:0px;padding:0px 0px;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" width="600px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:598px;" width="598" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:white;background-color:white;Margin:0px auto;max-width:598px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:white;background-color:white;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:598px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;"><tbody><tr><td style="width:250px;"><img height="auto" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/datagrandlyoncom.png" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;" width="250"></td></tr></tbody></table></td></tr><tr><td style="font-size:0px;padding:10px 25px;word-break:break-word;"><p style="border-top:solid 4px #ed1c24;font-size:1;margin:0px auto;width:100%;"></p><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" style="border-top:solid 4px #ed1c24;font-size:1;margin:0px auto;width:548px;" role="presentation" width="548px" ><tr><td style="height:0;line-height:0;">
-</td></tr></table><![endif]--></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">Bonjour,</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">Vous nous avez récemment contacté via le formulaire de contact de la plateforme data.grandlyon.com.</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">Voici un résumé de votre demande:</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;text-decoration:underline;color:#000000;">Sujet:</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;padding-left:40px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">${options.subject}</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;text-decoration:underline;color:#000000;">Message:</div></td></tr><tr><td align="left" class="pre" style="white-space: pre; font-size: 0px; padding: 10px 25px; padding-left: 40px; word-break: break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">${options.message}</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">Nous reviendrons vers vous dans les plus brefs délais.</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">L'équipe de data.grandlyon.com</div></td></tr></table></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr><tr><td class="" width="600px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:598px;" width="598" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:#ed1c24;background-color:#ed1c24;Margin:0px auto;max-width:598px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#ed1c24;background-color:#ed1c24;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:598px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;"><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" ><tr><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:4px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:25px;"><tr><td style="font-size:0;height:25px;vertical-align:middle;width:25px;"><a href="https://download.data.grandlyon.com/catalogue/srv/fre/rss.search?sortBy=publicationDate&georss=simplepoint&data" target="_blank"><img height="25" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/rss.png" style="border-radius:3px;" width="25"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:4px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:25px;"><tr><td style="font-size:0;height:25px;vertical-align:middle;width:25px;"><a href="http://www.facebook.com/legrandlyon" target="_blank"><img height="25" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/facebook.png" style="border-radius:3px;" width="25"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:4px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:25px;"><tr><td style="font-size:0;height:25px;vertical-align:middle;width:25px;"><a href="https://twitter.com/grandlyon" target="_blank"><img height="25" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/twitter.png" style="border-radius:3px;" width="25"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></table></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table><![endif]--></div></body></html>
\ No newline at end of file
+ }</style><style type="text/css">.warn-message {
+ color: "white";
+ }
+
+ .link {
+ color: white;
+ font-weight: bold;
+ }
+
+ .pre {
+ white-space: pre;
+ }
+
+ @media (max-width:480px) {
+ .title {
+ padding: 7% 10% !important;
+ }
+ }</style></head><body><div class="body"><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:800px;" width="800" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="Margin:0px auto;max-width:800px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:0;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" width="800px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:800px;" width="800" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:#333744;background-color:#333744;Margin:0px auto;max-width:800px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#333744;background-color:#333744;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:3% 6%;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="width:788px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:0;line-height:0;text-align:left;display:inline-block;width:100%;direction:ltr;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td style="vertical-align:top;width:394px;" ><![endif]--><div class="mj-column-per-50 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:50%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="left" style="font-size:0px;padding:0;word-break:break-word;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;"><tbody><tr><td style="width:130px;"><img alt="Logo data.grandlyon.com" height="auto" src="${options.imageHost}/logo_data_neg.png" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;" width="130"></td></tr></tbody></table></td></tr></table></div><!--[if mso | IE]></td><td style="vertical-align:top;width:394px;" ><![endif]--><div class="mj-column-per-50 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:50%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="right" style="font-size:0px;padding:0;word-break:break-word;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;"><tbody><tr><td style="width:80px;"><img alt="Logo Grand Lyon" height="auto" src="${options.imageHost}/logo_gl_négatif.png" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;" width="80"></td></tr></tbody></table></td></tr></table></div><!--[if mso | IE]></td></tr></table><![endif]--></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr><tr><td class="" width="800px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:800px;" width="800" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:#f2f2f2;background-color:#f2f2f2;Margin:0px auto;max-width:800px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#f2f2f2;background-color:#f2f2f2;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:3% 6%;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:788px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%"><tbody><tr><td style="background-color:white;vertical-align:top;padding:3% 6%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%"><tr><td align="center" class="title" style="font-size:0px;padding:3% 10%;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:18px;font-weight:bold;line-height:18px;text-align:center;color:#333744;">Contact</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:left;color:#333744;">Bonjour ${options.firstName},</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:left;color:#333744;">Votre formulaire de contact a bien été reçu le ${options.datetime} par nos services.</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:left;color:#333744;">Voici un résumé de votre demande :</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-weight:bold;line-height:18px;text-align:left;color:#333744;">Sujet:</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-style:italic;line-height:18px;text-align:left;color:#333744;">${options.subject}</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-weight:bold;line-height:18px;text-align:left;color:#333744;">Message:</div></td></tr><tr><td align="left" class="pre" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-style:italic;line-height:18px;text-align:left;color:#333744;">${options.message}</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:left;color:#333744;">Nous nous engageons à répondre dans les meilleurs délais.</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:left;color:#333744;">Nous vous remercions de l’intérêt porté à notre plateforme.</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:left;color:#333744;">Bien cordialement,</div></td></tr><tr><td align="right" style="font-size:0px;padding:3% 0 0 0;padding-top:3%;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:right;color:#333744;">L'équipe data.grandlyon.com</div></td></tr><tr><td align="right" style="font-size:0px;padding:10px 25px;padding-top:1%;padding-right:0;word-break:break-word;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;"><tbody><tr><td style="width:105px;"><img alt="Logo data.grandlyon.com" height="auto" src="${options.imageHost}/logo_data.png" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;" width="105"></td></tr></tbody></table></td></tr></table></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr><tr><td class="" width="800px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:800px;" width="800" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:#333744;background-color:#333744;Margin:0px auto;max-width:800px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#333744;background-color:#333744;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:3% 6%;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:788px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="center" style="font-size:0px;padding:0;word-break:break-word;"><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" ><tr><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:0 5px 0 5px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:16px;"><tr><td style="font-size:0;height:16px;vertical-align:middle;width:16px;"><a href="https://download.data.grandlyon.com/catalogue/srv/fre/rss.search?sortBy=publicationDate&georss=simplepoint&data" target="_blank"><img alt="Logo rss" height="16" src="${options.imageHost}/logo_rss.png" style="border-radius:3px;" width="16"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:0 5px 0 5px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:16px;"><tr><td style="font-size:0;height:16px;vertical-align:middle;width:16px;"><a href="http://www.facebook.com/legrandlyon" target="_blank"><img alt="Logo Facebook" height="16" src="${options.imageHost}/logo_fb.png" style="border-radius:3px;" width="16"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:0 5px 0 5px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:16px;"><tr><td style="font-size:0;height:16px;vertical-align:middle;width:16px;"><a href="https://twitter.com/grandlyon" target="_blank"><img alt="Logo Twitter" height="16" src="${options.imageHost}/logo_twi.png" style="border-radius:3px;" width="16"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></table></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table><![endif]--></div></body></html>
\ No newline at end of file
diff --git a/src/email-templates/contact/contact-user.mjml b/src/email-templates/contact/contact-user.mjml
index 1d44883..389f095 100644
--- a/src/email-templates/contact/contact-user.mjml
+++ b/src/email-templates/contact/contact-user.mjml
@@ -1,63 +1,96 @@
-<mjml>
+<mjml lang="fr">
<mj-head>
<mj-title>Contact</mj-title>
<mj-font name="Lato" href="https://fonts.googleapis.com/css?family=Lato" />
<mj-attributes>
- <mj-text font-family="Lato" line-height="25px" font-size="16px" />
+ <mj-text font-family="Lato, sans-serif" line-height="18px" font-size="14px" padding="3% 0 0 0" color="#333744"></mj-text>
+ <mj-social-element padding="0 5px 0 5px"></mj-social-element>
</mj-attributes>
- <mj-style inline="inline">
+ <mj-style>
+ .warn-message {
+ color: "white";
+ }
+
+ .link {
+ color: white;
+ font-weight: bold;
+ }
+
.pre {
white-space: pre;
}
+
+ @media (max-width:480px) {
+ .title {
+ padding: 7% 10% !important;
+ }
+ }
</mj-style>
</mj-head>
- <mj-body>
- <mj-wrapper border="1px solid #ccc" padding="0px 0px">
- <mj-section background-color="white">
- <mj-column>
-
- <mj-image width="250px" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/datagrandlyoncom.png"></mj-image>
-
- <mj-divider border-color="#ed1c24"></mj-divider>
-
- <mj-text>Bonjour,</mj-text>
-
- <mj-text>Vous nous avez récemment contacté via le formulaire de contact de la plateforme data.grandlyon.com.</mj-text>
-
- <mj-text>Voici un résumé de votre demande:</mj-text>
-
- <mj-text text-decoration="underline">
- Sujet:
- </mj-text>
+ <mj-body width="800px" css-class="body">
+ <mj-wrapper padding="0">
+ <mj-section background-color="#333744" padding="3% 6%">
+ <mj-group>
+ <mj-column>
+ <mj-image width="130px" align="left" padding="0" alt="Logo data.grandlyon.com" src="${options.imageHost}/logo_data_neg.png"></mj-image>
+ </mj-column>
+ <mj-column>
+ <mj-image width="80px" align="right" padding="0" alt="Logo Grand Lyon" src="${options.imageHost}/logo_gl_négatif.png"></mj-image>
+ </mj-column>
+ </mj-group>
+ </mj-section>
- <mj-text padding-left="40px">${options.subject}</mj-text>
+ <mj-section background-color="#f2f2f2" padding="3% 6%">
+ <mj-column background-color="white" padding="3% 6%">
+ <mj-text align="center" css-class="title" font-size="18px" font-weight="bold" padding="3% 10%">
+ Contact
+ </mj-text>
+ <mj-text>
+ Bonjour ${options.firstName},
+ </mj-text>
+ <mj-text>
+ Votre formulaire de contact a bien été reçu le ${options.datetime} par nos services.
+ </mj-text>
+ <mj-text>
+ Voici un résumé de votre demande :
+ </mj-text>
+ <mj-text font-weight="bold">
+ Sujet:
+ </mj-text>
- <mj-text text-decoration="underline">
- Message:
- </mj-text>
+ <mj-text font-style="italic">${options.subject}</mj-text>
- <mj-text padding-left="40px" css-class="pre">
- ${options.message}
- </mj-text>
+ <mj-text font-weight="bold">
+ Message:
+ </mj-text>
- <mj-text>Nous reviendrons vers vous dans les plus brefs délais.</mj-text>
+ <mj-text css-class="pre" font-style="italic">${options.message}
+ </mj-text>
- <mj-text>
- L'équipe de data.grandlyon.com
- </mj-text>
-
+ <mj-text>
+ Nous nous engageons à répondre dans les meilleurs délais.
+ </mj-text>
+ <mj-text>
+ Nous vous remercions de l’intérêt porté à notre plateforme.
+ </mj-text>
+ <mj-text>
+ Bien cordialement,
+ </mj-text>
+ <mj-text align="right" padding-top="3%">
+ L'équipe data.grandlyon.com
</mj-text>
+ <mj-image align="right" width="105px" padding-right="0" padding-top="1%" alt="Logo data.grandlyon.com" src="${options.imageHost}/logo_data.png"></mj-image>
</mj-column>
</mj-section>
- <mj-section background-color="#ed1c24">
+ <mj-section background-color="#333744" padding="3% 6%">
<mj-column>
- <mj-social font-size="15px" icon-size="25px" mode="horizontal">
- <mj-social-element href="https://download.data.grandlyon.com/catalogue/srv/fre/rss.search?sortBy=publicationDate&georss=simplepoint&data" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/rss.png">
+ <mj-social padding="0" font-size="15px" icon-size="16px" mode="horizontal">
+ <mj-social-element alt="Logo rss" href="https://download.data.grandlyon.com/catalogue/srv/fre/rss.search?sortBy=publicationDate&georss=simplepoint&data" src="${options.imageHost}/logo_rss.png">
</mj-social-element>
- <mj-social-element href="http://www.facebook.com/legrandlyon" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/facebook.png">
+ <mj-social-element alt="Logo Facebook" href="http://www.facebook.com/legrandlyon" src="${options.imageHost}/logo_fb.png">
</mj-social-element>
- <mj-social-element href="https://twitter.com/grandlyon" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/twitter.png">
+ <mj-social-element alt="Logo Twitter" href="https://twitter.com/grandlyon" src="${options.imageHost}/logo_twi.png">
</mj-social-element>
</mj-social>
</mj-column>
diff --git a/src/email-templates/contact/index.ts b/src/email-templates/contact/index.ts
index 5c506d4..e54dd94 100644
--- a/src/email-templates/contact/index.ts
+++ b/src/email-templates/contact/index.ts
@@ -1,5 +1,5 @@
export const buildContactUserEmail = (options: ContactUserEmailBodyOptions) => {
- const html = `<!doctype html><html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office"><head><title>Contact</title><!--[if !mso]><!-- --><meta http-equiv="X-UA-Compatible" content="IE=edge"><!--<![endif]--><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><style type="text/css">#outlook a { padding:0; }
+ const html = `<!doctype html><html lang="fr" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office"><head><title>Contact</title><!--[if !mso]><!-- --><meta http-equiv="X-UA-Compatible" content="IE=edge"><!--<![endif]--><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><style type="text/css">#outlook a { padding:0; }
.ReadMsgBody { width:100%; }
.ExternalClass { width:100%; }
.ExternalClass * { line-height:100%; }
@@ -22,17 +22,34 @@ export const buildContactUserEmail = (options: ContactUserEmailBodyOptions) => {
</style>
<![endif]--><!--[if !mso]><!--><link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet" type="text/css"><style type="text/css">@import url(https://fonts.googleapis.com/css?family=Lato);</style><!--<![endif]--><style type="text/css">@media only screen and (min-width:480px) {
.mj-column-per-100 { width:100% !important; max-width: 100%; }
+.mj-column-per-50 { width:50% !important; max-width: 50%; }
}</style><style type="text/css">@media only screen and (max-width:480px) {
table.full-width-mobile { width: 100% !important; }
td.full-width-mobile { width: auto !important; }
-}</style></head><body><div><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="Margin:0px auto;max-width:600px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;"><tbody><tr><td style="border:1px solid #ccc;direction:ltr;font-size:0px;padding:0px 0px;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" width="600px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:598px;" width="598" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:white;background-color:white;Margin:0px auto;max-width:598px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:white;background-color:white;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:598px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;"><tbody><tr><td style="width:250px;"><img height="auto" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/datagrandlyoncom.png" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;" width="250"></td></tr></tbody></table></td></tr><tr><td style="font-size:0px;padding:10px 25px;word-break:break-word;"><p style="border-top:solid 4px #ed1c24;font-size:1;margin:0px auto;width:100%;"></p><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" style="border-top:solid 4px #ed1c24;font-size:1;margin:0px auto;width:548px;" role="presentation" width="548px" ><tr><td style="height:0;line-height:0;">
-</td></tr></table><![endif]--></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">Bonjour,</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">Vous nous avez récemment contacté via le formulaire de contact de la plateforme data.grandlyon.com.</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">Voici un résumé de votre demande:</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;text-decoration:underline;color:#000000;">Sujet:</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;padding-left:40px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">${options.subject}</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;text-decoration:underline;color:#000000;">Message:</div></td></tr><tr><td align="left" class="pre" style="white-space: pre; font-size: 0px; padding: 10px 25px; padding-left: 40px; word-break: break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">${options.message}</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">Nous reviendrons vers vous dans les plus brefs délais.</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">L'équipe de data.grandlyon.com</div></td></tr></table></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr><tr><td class="" width="600px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:598px;" width="598" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:#ed1c24;background-color:#ed1c24;Margin:0px auto;max-width:598px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#ed1c24;background-color:#ed1c24;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:598px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;"><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" ><tr><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:4px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:25px;"><tr><td style="font-size:0;height:25px;vertical-align:middle;width:25px;"><a href="https://download.data.grandlyon.com/catalogue/srv/fre/rss.search?sortBy=publicationDate&georss=simplepoint&data" target="_blank"><img height="25" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/rss.png" style="border-radius:3px;" width="25"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:4px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:25px;"><tr><td style="font-size:0;height:25px;vertical-align:middle;width:25px;"><a href="http://www.facebook.com/legrandlyon" target="_blank"><img height="25" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/facebook.png" style="border-radius:3px;" width="25"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:4px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:25px;"><tr><td style="font-size:0;height:25px;vertical-align:middle;width:25px;"><a href="https://twitter.com/grandlyon" target="_blank"><img height="25" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/twitter.png" style="border-radius:3px;" width="25"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></table></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table><![endif]--></div></body></html>`;
+}</style><style type="text/css">.warn-message {
+color: "white";
+}
+
+.link {
+color: white;
+font-weight: bold;
+}
+
+.pre {
+white-space: pre;
+}
+
+@media (max-width:480px) {
+.title {
+ padding: 7% 10% !important;
+}
+}</style></head><body><div class="body"><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:800px;" width="800" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="Margin:0px auto;max-width:800px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:0;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" width="800px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:800px;" width="800" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:#333744;background-color:#333744;Margin:0px auto;max-width:800px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#333744;background-color:#333744;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:3% 6%;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="width:788px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:0;line-height:0;text-align:left;display:inline-block;width:100%;direction:ltr;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td style="vertical-align:top;width:394px;" ><![endif]--><div class="mj-column-per-50 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:50%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="left" style="font-size:0px;padding:0;word-break:break-word;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;"><tbody><tr><td style="width:130px;"><img alt="Logo data.grandlyon.com" height="auto" src="${options.imageHost}/logo_data_neg.png" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;" width="130"></td></tr></tbody></table></td></tr></table></div><!--[if mso | IE]></td><td style="vertical-align:top;width:394px;" ><![endif]--><div class="mj-column-per-50 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:50%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="right" style="font-size:0px;padding:0;word-break:break-word;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;"><tbody><tr><td style="width:80px;"><img alt="Logo Grand Lyon" height="auto" src="${options.imageHost}/logo_gl_négatif.png" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;" width="80"></td></tr></tbody></table></td></tr></table></div><!--[if mso | IE]></td></tr></table><![endif]--></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr><tr><td class="" width="800px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:800px;" width="800" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:#f2f2f2;background-color:#f2f2f2;Margin:0px auto;max-width:800px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#f2f2f2;background-color:#f2f2f2;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:3% 6%;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:788px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%"><tbody><tr><td style="background-color:white;vertical-align:top;padding:3% 6%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%"><tr><td align="center" class="title" style="font-size:0px;padding:3% 10%;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:18px;font-weight:bold;line-height:18px;text-align:center;color:#333744;">Contact</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:left;color:#333744;">Bonjour ${options.firstName},</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:left;color:#333744;">Votre formulaire de contact a bien été reçu le ${options.datetime} par nos services.</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:left;color:#333744;">Voici un résumé de votre demande :</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-weight:bold;line-height:18px;text-align:left;color:#333744;">Sujet:</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-style:italic;line-height:18px;text-align:left;color:#333744;">${options.subject}</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-weight:bold;line-height:18px;text-align:left;color:#333744;">Message:</div></td></tr><tr><td align="left" class="pre" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-style:italic;line-height:18px;text-align:left;color:#333744;">${options.message}</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:left;color:#333744;">Nous nous engageons à répondre dans les meilleurs délais.</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:left;color:#333744;">Nous vous remercions de l’intérêt porté à notre plateforme.</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:left;color:#333744;">Bien cordialement,</div></td></tr><tr><td align="right" style="font-size:0px;padding:3% 0 0 0;padding-top:3%;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:right;color:#333744;">L'équipe data.grandlyon.com</div></td></tr><tr><td align="right" style="font-size:0px;padding:10px 25px;padding-top:1%;padding-right:0;word-break:break-word;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;"><tbody><tr><td style="width:105px;"><img alt="Logo data.grandlyon.com" height="auto" src="${options.imageHost}/logo_data.png" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;" width="105"></td></tr></tbody></table></td></tr></table></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr><tr><td class="" width="800px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:800px;" width="800" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:#333744;background-color:#333744;Margin:0px auto;max-width:800px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#333744;background-color:#333744;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:3% 6%;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:788px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="center" style="font-size:0px;padding:0;word-break:break-word;"><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" ><tr><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:0 5px 0 5px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:16px;"><tr><td style="font-size:0;height:16px;vertical-align:middle;width:16px;"><a href="https://download.data.grandlyon.com/catalogue/srv/fre/rss.search?sortBy=publicationDate&georss=simplepoint&data" target="_blank"><img alt="Logo rss" height="16" src="${options.imageHost}/logo_rss.png" style="border-radius:3px;" width="16"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:0 5px 0 5px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:16px;"><tr><td style="font-size:0;height:16px;vertical-align:middle;width:16px;"><a href="http://www.facebook.com/legrandlyon" target="_blank"><img alt="Logo Facebook" height="16" src="${options.imageHost}/logo_fb.png" style="border-radius:3px;" width="16"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:0 5px 0 5px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:16px;"><tr><td style="font-size:0;height:16px;vertical-align:middle;width:16px;"><a href="https://twitter.com/grandlyon" target="_blank"><img alt="Logo Twitter" height="16" src="${options.imageHost}/logo_twi.png" style="border-radius:3px;" width="16"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></table></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table><![endif]--></div></body></html>`;
return html;
};
export const buildContactAdminEmail = (options: ContactAdminEmailBodyOptions) => {
- const html = `<!doctype html><html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office"><head><title>Contact</title><!--[if !mso]><!-- --><meta http-equiv="X-UA-Compatible" content="IE=edge"><!--<![endif]--><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><style type="text/css">#outlook a { padding:0; }
+ const html = `<!doctype html><html lang="fr" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office"><head><title>Contact</title><!--[if !mso]><!-- --><meta http-equiv="X-UA-Compatible" content="IE=edge"><!--<![endif]--><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1"><style type="text/css">#outlook a { padding:0; }
.ReadMsgBody { width:100%; }
.ExternalClass { width:100%; }
.ExternalClass * { line-height:100%; }
@@ -55,11 +72,28 @@ export const buildContactAdminEmail = (options: ContactAdminEmailBodyOptions) =>
</style>
<![endif]--><!--[if !mso]><!--><link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet" type="text/css"><style type="text/css">@import url(https://fonts.googleapis.com/css?family=Lato);</style><!--<![endif]--><style type="text/css">@media only screen and (min-width:480px) {
.mj-column-per-100 { width:100% !important; max-width: 100%; }
+.mj-column-per-50 { width:50% !important; max-width: 50%; }
}</style><style type="text/css">@media only screen and (max-width:480px) {
table.full-width-mobile { width: 100% !important; }
td.full-width-mobile { width: auto !important; }
-}</style></head><body><div><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="Margin:0px auto;max-width:600px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;"><tbody><tr><td style="border:1px solid #ccc;direction:ltr;font-size:0px;padding:0px 0px;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" width="600px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:598px;" width="598" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:white;background-color:white;Margin:0px auto;max-width:598px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:white;background-color:white;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:598px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;"><tbody><tr><td style="width:250px;"><img height="auto" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/datagrandlyoncom.png" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;" width="250"></td></tr></tbody></table></td></tr><tr><td style="font-size:0px;padding:10px 25px;word-break:break-word;"><p style="border-top:solid 4px #ed1c24;font-size:1;margin:0px auto;width:100%;"></p><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" style="border-top:solid 4px #ed1c24;font-size:1;margin:0px auto;width:548px;" role="presentation" width="548px" ><tr><td style="height:0;line-height:0;">
-</td></tr></table><![endif]--></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">Une demande de contact a récemment été déposée par l'utilisateur ${options.firstName} ${options.lastName}.</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;text-decoration:underline;color:#000000;">Email:</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;padding-left:40px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">${options.email}</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;text-decoration:underline;color:#000000;">Sujet:</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;padding-left:40px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">${options.subject}</div></td></tr><tr><td align="left" style="font-size:0px;padding:10px 25px;word-break:break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;text-decoration:underline;color:#000000;">Message:</div></td></tr><tr><td align="left" class="pre" style="white-space: pre; font-size: 0px; padding: 10px 25px; padding-left: 40px; word-break: break-word;"><div style="font-family:Lato;font-size:16px;line-height:25px;text-align:left;color:#000000;">${options.message}</div></td></tr></table></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr><tr><td class="" width="600px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:598px;" width="598" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:#ed1c24;background-color:#ed1c24;Margin:0px auto;max-width:598px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#ed1c24;background-color:#ed1c24;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:598px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="center" style="font-size:0px;padding:10px 25px;word-break:break-word;"><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" ><tr><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:4px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:25px;"><tr><td style="font-size:0;height:25px;vertical-align:middle;width:25px;"><a href="https://download.data.grandlyon.com/catalogue/srv/fre/rss.search?sortBy=publicationDate&georss=simplepoint&data" target="_blank"><img height="25" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/rss.png" style="border-radius:3px;" width="25"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:4px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:25px;"><tr><td style="font-size:0;height:25px;vertical-align:middle;width:25px;"><a href="http://www.facebook.com/legrandlyon" target="_blank"><img height="25" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/facebook.png" style="border-radius:3px;" width="25"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:4px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:25px;"><tr><td style="font-size:0;height:25px;vertical-align:middle;width:25px;"><a href="https://twitter.com/grandlyon" target="_blank"><img height="25" src="https://highway-to-data.alpha.grandlyon.com/email-template-assets/twitter.png" style="border-radius:3px;" width="25"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></table></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table><![endif]--></div></body></html>`;
+}</style><style type="text/css">.warn-message {
+color: "white";
+}
+
+.link {
+color: white;
+font-weight: bold;
+}
+
+.pre {
+white-space: pre;
+}
+
+@media (max-width:480px) {
+.title {
+ padding: 7% 10% !important;
+}
+}</style></head><body><div class="body"><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:800px;" width="800" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="Margin:0px auto;max-width:800px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:0;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" width="800px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:800px;" width="800" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:#333744;background-color:#333744;Margin:0px auto;max-width:800px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#333744;background-color:#333744;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:3% 6%;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="width:788px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:0;line-height:0;text-align:left;display:inline-block;width:100%;direction:ltr;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td style="vertical-align:top;width:394px;" ><![endif]--><div class="mj-column-per-50 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:50%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="left" style="font-size:0px;padding:0;word-break:break-word;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;"><tbody><tr><td style="width:130px;"><img alt="Logo data.grandlyon.com" height="auto" src="${options.imageHost}/logo_data_neg.png" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;" width="130"></td></tr></tbody></table></td></tr></table></div><!--[if mso | IE]></td><td style="vertical-align:top;width:394px;" ><![endif]--><div class="mj-column-per-50 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:50%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="right" style="font-size:0px;padding:0;word-break:break-word;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;"><tbody><tr><td style="width:80px;"><img alt="Logo Grand Lyon" height="auto" src="${options.imageHost}/logo_gl_négatif.png" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;" width="80"></td></tr></tbody></table></td></tr></table></div><!--[if mso | IE]></td></tr></table><![endif]--></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr><tr><td class="" width="800px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:800px;" width="800" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:#f2f2f2;background-color:#f2f2f2;Margin:0px auto;max-width:800px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#f2f2f2;background-color:#f2f2f2;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:3% 6%;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:788px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%"><tbody><tr><td style="background-color:white;vertical-align:top;padding:3% 6%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%"><tr><td align="center" class="title" style="font-size:0px;padding:3% 10%;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:18px;font-weight:bold;line-height:18px;text-align:center;color:#333744;">Contact</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:left;color:#333744;">Une demande de contact a été déposée le ${options.datetime} par l'utilisateur ${options.firstName} ${options.lastName}.</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:left;color:#333744;">Voici un résumé de la demande :</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-weight:bold;line-height:18px;text-align:left;color:#333744;">Email:</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-style:italic;line-height:18px;text-align:left;color:#333744;">${options.email}</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-weight:bold;line-height:18px;text-align:left;color:#333744;">Sujet:</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-style:italic;line-height:18px;text-align:left;color:#333744;">${options.subject}</div></td></tr><tr><td align="left" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-weight:bold;line-height:18px;text-align:left;color:#333744;">Message:</div></td></tr><tr><td align="left" class="pre" style="font-size:0px;padding:3% 0 0 0;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;font-style:italic;line-height:18px;text-align:left;color:#333744;">${options.message}</div></td></tr><tr><td align="right" style="font-size:0px;padding:3% 0 0 0;padding-top:3%;word-break:break-word;"><div style="font-family:Lato, sans-serif;font-size:14px;line-height:18px;text-align:right;color:#333744;">L'équipe data.grandlyon.com</div></td></tr><tr><td align="right" style="font-size:0px;padding:10px 25px;padding-top:1%;padding-right:0;word-break:break-word;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:collapse;border-spacing:0px;"><tbody><tr><td style="width:105px;"><img alt="Logo data.grandlyon.com" height="auto" src="${options.imageHost}/logo_data.png" style="border:0;display:block;outline:none;text-decoration:none;height:auto;width:100%;" width="105"></td></tr></tbody></table></td></tr></table></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr><tr><td class="" width="800px" ><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:800px;" width="800" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--><div style="background:#333744;background-color:#333744;Margin:0px auto;max-width:800px;"><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#333744;background-color:#333744;width:100%;"><tbody><tr><td style="direction:ltr;font-size:0px;padding:3% 6%;text-align:center;vertical-align:top;"><!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:788px;" ><![endif]--><div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="vertical-align:top;" width="100%"><tr><td align="center" style="font-size:0px;padding:0;word-break:break-word;"><!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" ><tr><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:0 5px 0 5px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:16px;"><tr><td style="font-size:0;height:16px;vertical-align:middle;width:16px;"><a href="https://download.data.grandlyon.com/catalogue/srv/fre/rss.search?sortBy=publicationDate&georss=simplepoint&data" target="_blank"><img alt="Logo rss" height="16" src="${options.imageHost}/logo_rss.png" style="border-radius:3px;" width="16"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:0 5px 0 5px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:16px;"><tr><td style="font-size:0;height:16px;vertical-align:middle;width:16px;"><a href="http://www.facebook.com/legrandlyon" target="_blank"><img alt="Logo Facebook" height="16" src="${options.imageHost}/logo_fb.png" style="border-radius:3px;" width="16"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td><td><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;"><tr><td style="padding:0 5px 0 5px;"><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:3px;width:16px;"><tr><td style="font-size:0;height:16px;vertical-align:middle;width:16px;"><a href="https://twitter.com/grandlyon" target="_blank"><img alt="Logo Twitter" height="16" src="${options.imageHost}/logo_twi.png" style="border-radius:3px;" width="16"></a></td></tr></table></td></tr></table><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></table></div><!--[if mso | IE]></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table></td></tr></table><![endif]--></td></tr></tbody></table></div><!--[if mso | IE]></td></tr></table><![endif]--></div></body></html>`;
return html;
};
@@ -67,6 +101,9 @@ td.full-width-mobile { width: auto !important; }
class ContactUserEmailBodyOptions {
message: string;
subject: string;
+ firstName: string;
+ datetime: string;
+ imageHost: string;
}
class ContactAdminEmailBodyOptions {
@@ -75,4 +112,6 @@ class ContactAdminEmailBodyOptions {
firstName: string;
lastName: string;
email: string;
+ datetime: string;
+ imageHost: string;
}
\ No newline at end of file
diff --git a/src/email/email.service.ts b/src/email/email.service.ts
index 673f5a8..27fc578 100644
--- a/src/email/email.service.ts
+++ b/src/email/email.service.ts
@@ -3,6 +3,7 @@ import * as amqp from 'amqplib';
import { ContactForm, Email, EmailWithoutFrom } from './email';
import { ConfigService } from 'configuration/config.service';
import { buildContactAdminEmail, buildContactUserEmail } from 'email-templates/contact';
+import moment = require('moment');
@Injectable()
export class EmailService {
@@ -22,10 +23,15 @@ export class EmailService {
firstName: contactForm.firstname,
lastName: contactForm.lastname,
email: contactForm.email,
+ datetime: moment().format('DD/MM/YYYY à HH:mm'),
+ imageHost: this.config.imageHost,
});
const userEmailBody = buildContactUserEmail({
subject: contactForm.subject,
message: contactForm.text,
+ firstName: contactForm.firstname,
+ datetime: moment().format('DD/MM/YYYY à HH:mm'),
+ imageHost: this.config.imageHost,
});
const adminEmail = new EmailWithoutFrom();
--
GitLab