@gov-cy/dsf-email-templates 1.0.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.github/workflows/mailtrap-test.yml +25 -0
- package/.github/workflows/tag-and-publish-on-version-change.yml +63 -0
- package/.github/workflows/unit-test.yml +22 -0
- package/CHANGELOG.md +76 -0
- package/LICENSE +21 -0
- package/NOTES.md +49 -0
- package/README.md +394 -0
- package/bin/dsf-email-templater.cmd +5 -0
- package/bin/dsf-email-templater.js +24 -0
- package/build/submission-email-small.html +124 -0
- package/build/submission-email.html +188 -0
- package/build/verification-email.html +85 -0
- package/package.json +41 -0
- package/src/DSFEmailRenderer.mjs +128 -0
- package/src/index.mjs +5 -0
- package/src/njk/components/body.njk +8 -0
- package/src/njk/components/bodyHeading.njk +27 -0
- package/src/njk/components/bodyList.njk +28 -0
- package/src/njk/components/bodyParagraph.njk +12 -0
- package/src/njk/components/footer.njk +20 -0
- package/src/njk/components/header.njk +35 -0
- package/src/njk/components/preHeader.njk +7 -0
- package/src/njk/components/success.njk +23 -0
- package/src/njk/govcyBase.njk +47 -0
- package/src/njk/govcyEmailElement.njk +44 -0
- package/src/njk/templates/submission-email-small.njk +47 -0
- package/src/njk/templates/submission-email.njk +65 -0
- package/src/njk/templates/verification-test.njk +33 -0
- package/test/mailtrap-njk.js +89 -0
- package/test/mailtrap.js +84 -0
- package/test/moca/unit.test.js +179 -0
|
@@ -0,0 +1,124 @@
|
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
|
|
3
|
+
<head>
|
|
4
|
+
<title>Service email</title>
|
|
5
|
+
<!--[if !mso]><!-->
|
|
6
|
+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
7
|
+
<!--<![endif]-->
|
|
8
|
+
<!--[if (gte mso 9)|(IE)]>
|
|
9
|
+
<style>
|
|
10
|
+
li {
|
|
11
|
+
margin-left:10px !important;
|
|
12
|
+
mso-special-format: bullet;
|
|
13
|
+
}
|
|
14
|
+
</style>
|
|
15
|
+
<![endif]-->
|
|
16
|
+
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
|
17
|
+
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
18
|
+
</head>
|
|
19
|
+
<body>
|
|
20
|
+
<!-- PRE HEADER TEXT -->
|
|
21
|
+
<div style="display:none;font-size:1px;color:#ffffff;line-height:1px;max-height:0px;max-width:0px;opacity:0;overflow:hidden;">The pre header text</div>
|
|
22
|
+
<table border="0" cellpadding="0" cellspacing="0" width="100%">
|
|
23
|
+
<tr>
|
|
24
|
+
<td align="center">
|
|
25
|
+
<!--[if mso]>
|
|
26
|
+
<table align="center" border="0" cellspacing="0" cellpadding="0" width="600">
|
|
27
|
+
<tr>
|
|
28
|
+
<td align="center" valign="top" width="600">
|
|
29
|
+
<![endif]-->
|
|
30
|
+
<!-- HEADER -->
|
|
31
|
+
|
|
32
|
+
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width: 600px;" >
|
|
33
|
+
<tr>
|
|
34
|
+
<!-- IMAGE -->
|
|
35
|
+
<td align="left" valign="top" style="padding: 12px 16px 0px;background:#31576f;background-color:#31576f;">
|
|
36
|
+
<img src="https://cdn.jsdelivr.net/gh/gov-cy/govdesign@main/govcylogo_v3.png" alt="gov.cy" border="0" />
|
|
37
|
+
</td>
|
|
38
|
+
</tr>
|
|
39
|
+
<tr>
|
|
40
|
+
<td align="left" valign="top" style="padding:0px 16px 12px;border-bottom: 4px solid #ffad2d;background:#31576f;background-color:#31576f;">
|
|
41
|
+
<!-- SERVICE NAME -->
|
|
42
|
+
<div style="font-family:Arial;font-size:18px;line-height:1.5;text-align:left; color:#ffffff;" >Service name</div>
|
|
43
|
+
</td>
|
|
44
|
+
</tr>
|
|
45
|
+
<tr>
|
|
46
|
+
<td align="center" valign="top" style="padding:20px 16px;">
|
|
47
|
+
<!-- SALUTATION -->
|
|
48
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >Dear First and Last name</div>
|
|
49
|
+
</td>
|
|
50
|
+
</tr>
|
|
51
|
+
</table>
|
|
52
|
+
<!-- SUCCESS -->
|
|
53
|
+
|
|
54
|
+
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="padding:10px 0;max-width: 600px;background:#00703c;background-color:#00703c;" >
|
|
55
|
+
<tr>
|
|
56
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
57
|
+
<!-- Received -->
|
|
58
|
+
<div style="font-family:helvetica;font-size:24px;font-weight:bold;line-height:1.5;text-align:center;color:#ffffff;">Success messasage</div>
|
|
59
|
+
</td>
|
|
60
|
+
</tr><tr>
|
|
61
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
62
|
+
<!-- details -->
|
|
63
|
+
<div style="font-family:Arial;font-size:18px;line-height:1.5;text-align:center;color:#ffffff;">Lorem ipsum</div>
|
|
64
|
+
</td>
|
|
65
|
+
</tr></table>
|
|
66
|
+
<!-- BODY -->
|
|
67
|
+
|
|
68
|
+
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width: 600px;" >
|
|
69
|
+
|
|
70
|
+
<tr>
|
|
71
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
72
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >
|
|
73
|
+
|
|
74
|
+
<h1 style="font-size:28px;font-weight:700;margin: 0;">
|
|
75
|
+
Heading 1
|
|
76
|
+
</h1>
|
|
77
|
+
|
|
78
|
+
</div>
|
|
79
|
+
</td>
|
|
80
|
+
</tr>
|
|
81
|
+
<tr>
|
|
82
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
83
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >
|
|
84
|
+
Body
|
|
85
|
+
</div>
|
|
86
|
+
</td>
|
|
87
|
+
</tr>
|
|
88
|
+
<tr>
|
|
89
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
90
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >
|
|
91
|
+
|
|
92
|
+
<ol style="margin:0; margin-left: 16px; padding:0; line-height:22px;" align="left">
|
|
93
|
+
<li>item 1</li><li>item 2</li><li>item 3</li></ol>
|
|
94
|
+
|
|
95
|
+
</div>
|
|
96
|
+
</td>
|
|
97
|
+
</tr>
|
|
98
|
+
</table>
|
|
99
|
+
<!-- FOOTER -->
|
|
100
|
+
|
|
101
|
+
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width: 600px;" >
|
|
102
|
+
<tr>
|
|
103
|
+
<td align="center" valign="top" style="padding:10px 16px 10px;border-top: 4px solid #ffad2d;background:#ebf1f3;background-color:#ebf1f3;">
|
|
104
|
+
<div style="font-family:Arial; font-size: 24px;text-align:left;margin-bottom: 10px;line-height:1;">
|
|
105
|
+
<a href="https://gov.cy" style="color:#000000; text-decoration: none;font-weight: 500;">
|
|
106
|
+
<strong style="color:#000000; text-decoration: none;font-weight: 500;">gov.cy</strong>
|
|
107
|
+
</a>
|
|
108
|
+
</div>
|
|
109
|
+
<div style="font-family:Arial;font-size:16px;text-align:left;margin-bottom: 10px;line-height:1;" >
|
|
110
|
+
Service name
|
|
111
|
+
</div>
|
|
112
|
+
</td>
|
|
113
|
+
</tr>
|
|
114
|
+
</table>
|
|
115
|
+
<!--[if mso]>
|
|
116
|
+
</td>
|
|
117
|
+
</tr>
|
|
118
|
+
</table>
|
|
119
|
+
<![endif]-->
|
|
120
|
+
</td>
|
|
121
|
+
</tr>
|
|
122
|
+
</table>
|
|
123
|
+
</body>
|
|
124
|
+
</html>
|
|
@@ -0,0 +1,188 @@
|
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="el" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
|
|
3
|
+
<head>
|
|
4
|
+
<title>Service email</title>
|
|
5
|
+
<!--[if !mso]><!-->
|
|
6
|
+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
7
|
+
<!--<![endif]-->
|
|
8
|
+
<!--[if (gte mso 9)|(IE)]>
|
|
9
|
+
<style>
|
|
10
|
+
li {
|
|
11
|
+
margin-left:10px !important;
|
|
12
|
+
mso-special-format: bullet;
|
|
13
|
+
}
|
|
14
|
+
</style>
|
|
15
|
+
<![endif]-->
|
|
16
|
+
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
|
17
|
+
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
18
|
+
</head>
|
|
19
|
+
<body>
|
|
20
|
+
<!-- PRE HEADER TEXT -->
|
|
21
|
+
<div style="display:none;font-size:1px;color:#ffffff;line-height:1px;max-height:0px;max-width:0px;opacity:0;overflow:hidden;">The pre header text</div>
|
|
22
|
+
<table border="0" cellpadding="0" cellspacing="0" width="100%">
|
|
23
|
+
<tr>
|
|
24
|
+
<td align="center">
|
|
25
|
+
<!--[if mso]>
|
|
26
|
+
<table align="center" border="0" cellspacing="0" cellpadding="0" width="600">
|
|
27
|
+
<tr>
|
|
28
|
+
<td align="center" valign="top" width="600">
|
|
29
|
+
<![endif]-->
|
|
30
|
+
<!-- HEADER -->
|
|
31
|
+
|
|
32
|
+
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width: 600px;" >
|
|
33
|
+
<tr>
|
|
34
|
+
<!-- IMAGE -->
|
|
35
|
+
<td align="left" valign="top" style="padding: 12px 16px 0px;background:#31576f;background-color:#31576f;">
|
|
36
|
+
<img src="https://cdn.jsdelivr.net/gh/gov-cy/govdesign@main/govcylogo_v3.png" alt="gov.cy" border="0" />
|
|
37
|
+
</td>
|
|
38
|
+
</tr>
|
|
39
|
+
<tr>
|
|
40
|
+
<td align="left" valign="top" style="padding:0px 16px 12px;border-bottom: 4px solid #ffad2d;background:#31576f;background-color:#31576f;">
|
|
41
|
+
<!-- SERVICE NAME -->
|
|
42
|
+
<div style="font-family:Arial;font-size:18px;line-height:1.5;text-align:left; color:#ffffff;" >Service name</div>
|
|
43
|
+
</td>
|
|
44
|
+
</tr>
|
|
45
|
+
<tr>
|
|
46
|
+
<td align="center" valign="top" style="padding:20px 16px;">
|
|
47
|
+
<!-- SALUTATION -->
|
|
48
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >Αγαπητέ / Αγαπητή First and Last name</div>
|
|
49
|
+
</td>
|
|
50
|
+
</tr>
|
|
51
|
+
</table>
|
|
52
|
+
<!-- SUCCESS -->
|
|
53
|
+
|
|
54
|
+
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="padding:10px 0;max-width: 600px;background:#00703c;background-color:#00703c;" >
|
|
55
|
+
<tr>
|
|
56
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
57
|
+
<!-- Received -->
|
|
58
|
+
<div style="font-family:helvetica;font-size:24px;font-weight:bold;line-height:1.5;text-align:center;color:#ffffff;">Έχουμε λάβει την αίτησή σας</div>
|
|
59
|
+
</td>
|
|
60
|
+
</tr><tr>
|
|
61
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
62
|
+
<!-- details -->
|
|
63
|
+
<div style="font-family:Arial;font-size:18px;line-height:1.5;text-align:center;color:#ffffff;">Η ημερομηνία της αίτησης είναι 12/1/2024 και ο αριθμός αναφοράς σας είναι DSF123456789.</div>
|
|
64
|
+
</td>
|
|
65
|
+
</tr></table>
|
|
66
|
+
<!-- BODY -->
|
|
67
|
+
|
|
68
|
+
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width: 600px;" >
|
|
69
|
+
|
|
70
|
+
<tr>
|
|
71
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
72
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >
|
|
73
|
+
|
|
74
|
+
<h1 style="font-size:28px;font-weight:700;margin: 0;">
|
|
75
|
+
Heading 1
|
|
76
|
+
</h1>
|
|
77
|
+
|
|
78
|
+
</div>
|
|
79
|
+
</td>
|
|
80
|
+
</tr>
|
|
81
|
+
<tr>
|
|
82
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
83
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >
|
|
84
|
+
Αν χρειαστούμε οποιοδήποτε άλλο στοιχείο κατά τη διάρκεια εξέτασης της αίτησής σας, θα επικοινωνήσουμε μαζί σας
|
|
85
|
+
</div>
|
|
86
|
+
</td>
|
|
87
|
+
</tr>
|
|
88
|
+
<tr>
|
|
89
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
90
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >
|
|
91
|
+
|
|
92
|
+
<h2 style="font-size:24px;font-weight:700;margin: 0;">
|
|
93
|
+
Heading 2
|
|
94
|
+
</h2>
|
|
95
|
+
|
|
96
|
+
</div>
|
|
97
|
+
</td>
|
|
98
|
+
</tr>
|
|
99
|
+
<tr>
|
|
100
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
101
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >
|
|
102
|
+
Lorem ipsum kai xero go kouventes
|
|
103
|
+
</div>
|
|
104
|
+
</td>
|
|
105
|
+
</tr>
|
|
106
|
+
<tr>
|
|
107
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
108
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >
|
|
109
|
+
|
|
110
|
+
<h3 style="font-size:20px;font-weight:700;margin: 0;">
|
|
111
|
+
Heading 3
|
|
112
|
+
</h3>
|
|
113
|
+
|
|
114
|
+
</div>
|
|
115
|
+
</td>
|
|
116
|
+
</tr>
|
|
117
|
+
<tr>
|
|
118
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
119
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >
|
|
120
|
+
Lorem ipsum kai xero go kouventes
|
|
121
|
+
</div>
|
|
122
|
+
</td>
|
|
123
|
+
</tr>
|
|
124
|
+
<tr>
|
|
125
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
126
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >
|
|
127
|
+
|
|
128
|
+
<h4 style="font-size:18px;font-weight:700;margin: 0;">
|
|
129
|
+
Heading 4
|
|
130
|
+
</h4>
|
|
131
|
+
|
|
132
|
+
</div>
|
|
133
|
+
</td>
|
|
134
|
+
</tr>
|
|
135
|
+
<tr>
|
|
136
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
137
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >
|
|
138
|
+
Lorem ipsum kai xero go kouventes
|
|
139
|
+
</div>
|
|
140
|
+
</td>
|
|
141
|
+
</tr>
|
|
142
|
+
<tr>
|
|
143
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
144
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >
|
|
145
|
+
|
|
146
|
+
<ol style="margin:0; margin-left: 16px; padding:0; line-height:22px;" align="left">
|
|
147
|
+
<li>xero -</li><li>go</li><li>kouvente</li></ol>
|
|
148
|
+
|
|
149
|
+
</div>
|
|
150
|
+
</td>
|
|
151
|
+
</tr>
|
|
152
|
+
<tr>
|
|
153
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
154
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >
|
|
155
|
+
|
|
156
|
+
<ul style="margin:0; margin-left: 16px; padding:0; line-height:22px;" align="left" type="disc">
|
|
157
|
+
<li><a href="#">xero</a></li><li>go</li><li>kouvente</li></ul>
|
|
158
|
+
|
|
159
|
+
</div>
|
|
160
|
+
</td>
|
|
161
|
+
</tr>
|
|
162
|
+
</table>
|
|
163
|
+
<!-- FOOTER -->
|
|
164
|
+
|
|
165
|
+
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width: 600px;" >
|
|
166
|
+
<tr>
|
|
167
|
+
<td align="center" valign="top" style="padding:10px 16px 10px;border-top: 4px solid #ffad2d;background:#ebf1f3;background-color:#ebf1f3;">
|
|
168
|
+
<div style="font-family:Arial; font-size: 24px;text-align:left;margin-bottom: 10px;line-height:1;">
|
|
169
|
+
<a href="https://gov.cy" style="color:#000000; text-decoration: none;font-weight: 500;">
|
|
170
|
+
<strong style="color:#000000; text-decoration: none;font-weight: 500;">gov.cy</strong>
|
|
171
|
+
</a>
|
|
172
|
+
</div>
|
|
173
|
+
<div style="font-family:Arial;font-size:16px;text-align:left;margin-bottom: 10px;line-height:1;" >
|
|
174
|
+
Όνομα υπηρεσίας
|
|
175
|
+
</div>
|
|
176
|
+
</td>
|
|
177
|
+
</tr>
|
|
178
|
+
</table>
|
|
179
|
+
<!--[if mso]>
|
|
180
|
+
</td>
|
|
181
|
+
</tr>
|
|
182
|
+
</table>
|
|
183
|
+
<![endif]-->
|
|
184
|
+
</td>
|
|
185
|
+
</tr>
|
|
186
|
+
</table>
|
|
187
|
+
</body>
|
|
188
|
+
</html>
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="el" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
|
|
3
|
+
<head>
|
|
4
|
+
<title>Service email</title>
|
|
5
|
+
<!--[if !mso]><!-->
|
|
6
|
+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
7
|
+
<!--<![endif]-->
|
|
8
|
+
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
|
9
|
+
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
10
|
+
</head>
|
|
11
|
+
<body>
|
|
12
|
+
<!-- PRE HEADER TEXT -->
|
|
13
|
+
<div style="display:none;font-size:1px;color:#ffffff;line-height:1px;max-height:0px;max-width:0px;opacity:0;overflow:hidden;">The pre header text</div>
|
|
14
|
+
<table border="0" cellpadding="0" cellspacing="0" width="100%">
|
|
15
|
+
<tr>
|
|
16
|
+
<td align="center">
|
|
17
|
+
<!--[if mso]>
|
|
18
|
+
<table align="center" border="0" cellspacing="0" cellpadding="0" width="600">
|
|
19
|
+
<tr>
|
|
20
|
+
<td align="center" valign="top" width="600">
|
|
21
|
+
<![endif]-->
|
|
22
|
+
<!-- HEADER -->
|
|
23
|
+
|
|
24
|
+
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width: 600px;" >
|
|
25
|
+
<tr>
|
|
26
|
+
<!-- IMAGE -->
|
|
27
|
+
<td align="left" valign="top" style="padding: 12px 16px 0px;background:#31576f;background-color:#31576f;">
|
|
28
|
+
<img src="https://cdn.jsdelivr.net/gh/gov-cy/govdesign@main/govcylogo_v3.png" alt="gov.cy" border="0" />
|
|
29
|
+
</td>
|
|
30
|
+
</tr>
|
|
31
|
+
<tr>
|
|
32
|
+
<td align="left" valign="top" style="padding:0px 16px 12px;border-bottom: 4px solid #ffad2d;background:#31576f;background-color:#31576f;">
|
|
33
|
+
<!-- SERVICE NAME -->
|
|
34
|
+
<div style="font-family:Arial;font-size:18px;line-height:1.5;text-align:left; color:#ffffff;" >Service name</div>
|
|
35
|
+
</td>
|
|
36
|
+
</tr>
|
|
37
|
+
<tr>
|
|
38
|
+
<td align="center" valign="top" style="padding:20px 16px;">
|
|
39
|
+
<!-- SALUTATION -->
|
|
40
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >Αγαπητέ / Αγαπητή First and Last name</div>
|
|
41
|
+
</td>
|
|
42
|
+
</tr>
|
|
43
|
+
</table>
|
|
44
|
+
<!-- SUCCESS -->
|
|
45
|
+
|
|
46
|
+
<!-- BODY -->
|
|
47
|
+
|
|
48
|
+
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width: 600px;" >
|
|
49
|
+
|
|
50
|
+
<tr>
|
|
51
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
52
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >
|
|
53
|
+
<h1 style="font-size:28px;font-weight:700;margin: 0;">
|
|
54
|
+
Verify code: 12234
|
|
55
|
+
</h1>
|
|
56
|
+
</div>
|
|
57
|
+
</td>
|
|
58
|
+
</tr>
|
|
59
|
+
</table>
|
|
60
|
+
<!-- FOOTER -->
|
|
61
|
+
|
|
62
|
+
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width: 600px;" >
|
|
63
|
+
<tr>
|
|
64
|
+
<td align="center" valign="top" style="padding:10px 16px 10px;border-top: 4px solid #ffad2d;background:#ebf1f3;background-color:#ebf1f3;">
|
|
65
|
+
<div style="font-family:Arial; font-size: 24px;text-align:left;margin-bottom: 10px;line-height:1;">
|
|
66
|
+
<a href="https://gov.cy" style="color:#000000; text-decoration: none;font-weight: 500;">
|
|
67
|
+
<strong style="color:#000000; text-decoration: none;font-weight: 500;">gov.cy</strong>
|
|
68
|
+
</a>
|
|
69
|
+
</div>
|
|
70
|
+
<div style="font-family:Arial;font-size:16px;text-align:left;margin-bottom: 10px;line-height:1;" >
|
|
71
|
+
Όνομα υπηρεσίας
|
|
72
|
+
</div>
|
|
73
|
+
</td>
|
|
74
|
+
</tr>
|
|
75
|
+
</table>
|
|
76
|
+
<!--[if mso]>
|
|
77
|
+
</td>
|
|
78
|
+
</tr>
|
|
79
|
+
</table>
|
|
80
|
+
<![endif]-->
|
|
81
|
+
</td>
|
|
82
|
+
</tr>
|
|
83
|
+
</table>
|
|
84
|
+
</body>
|
|
85
|
+
</html>
|
package/package.json
ADDED
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@gov-cy/dsf-email-templates",
|
|
3
|
+
"version": "1.0.8",
|
|
4
|
+
"description": "This project can be used to produce html email templates to be used by DSF.",
|
|
5
|
+
"author": "DMRID - DSF Team",
|
|
6
|
+
"license": "MIT",
|
|
7
|
+
"type": "module",
|
|
8
|
+
"main": "src/index.mjs",
|
|
9
|
+
"module": "src/index.mjs",
|
|
10
|
+
"bin": {
|
|
11
|
+
"dsf-email-templater": "./bin/dsf-email-templater.js"
|
|
12
|
+
},
|
|
13
|
+
"keywords": [
|
|
14
|
+
"govcy",
|
|
15
|
+
"design system",
|
|
16
|
+
"dsf",
|
|
17
|
+
"email",
|
|
18
|
+
"template",
|
|
19
|
+
"builder"
|
|
20
|
+
],
|
|
21
|
+
"repository": {
|
|
22
|
+
"type": "git",
|
|
23
|
+
"url": "https://github.com/gov-cy/dsf-email-template.git"
|
|
24
|
+
},
|
|
25
|
+
"homepage": "https://github.com/gov-cy/dsf-email-template",
|
|
26
|
+
"dependencies": {
|
|
27
|
+
"nodemailer": "^6.8.0",
|
|
28
|
+
"nunjucks": "^3.2.4",
|
|
29
|
+
"semver": ">=7.5.2"
|
|
30
|
+
},
|
|
31
|
+
"scripts": {
|
|
32
|
+
"test": "mocha --timeout 60000 ./test/**/*.test.js",
|
|
33
|
+
"test-mailtrap": "node ./test/mailtrap.js",
|
|
34
|
+
"test-mailtrap-njk": "node ./test/mailtrap-njk.js",
|
|
35
|
+
"build": "node ./bin/dsf-email-templater.js"
|
|
36
|
+
},
|
|
37
|
+
"devDependencies": {
|
|
38
|
+
"chai": "^5.1.0",
|
|
39
|
+
"mocha": "^10.4.0"
|
|
40
|
+
}
|
|
41
|
+
}
|
|
@@ -0,0 +1,128 @@
|
|
|
1
|
+
import nunjucks from 'nunjucks';
|
|
2
|
+
import fs from 'fs/promises';
|
|
3
|
+
import { dirname, join } from 'path';
|
|
4
|
+
import { fileURLToPath } from 'url';
|
|
5
|
+
|
|
6
|
+
/**
|
|
7
|
+
* Used to render emails based on govcy components
|
|
8
|
+
*/
|
|
9
|
+
export default class DSFEmailRenderer {
|
|
10
|
+
/**
|
|
11
|
+
* The class constructor. Configures nunjucks
|
|
12
|
+
*
|
|
13
|
+
* @param {sting} templateDirectory The path of the njk macros
|
|
14
|
+
*/
|
|
15
|
+
constructor() {
|
|
16
|
+
|
|
17
|
+
const __dirname = dirname(fileURLToPath(import.meta.url));
|
|
18
|
+
// console.log(__dirname)
|
|
19
|
+
|
|
20
|
+
// Construct the absolute path to the template directory
|
|
21
|
+
const templateDirectory = join(__dirname, 'njk');
|
|
22
|
+
nunjucks.configure(templateDirectory);
|
|
23
|
+
}
|
|
24
|
+
/**
|
|
25
|
+
* Renders the email html in file, based on an input html string
|
|
26
|
+
*
|
|
27
|
+
* @param {string} inputHTML The input
|
|
28
|
+
* @param {string} outputPath The path of the output html file
|
|
29
|
+
*/
|
|
30
|
+
async saveFile(inputHTML, outputPath) {
|
|
31
|
+
try {
|
|
32
|
+
// Write rendered content to output file
|
|
33
|
+
await fs.writeFile(outputPath, inputHTML);
|
|
34
|
+
console.log(`File rendered and saved to ${outputPath}`);
|
|
35
|
+
} catch (error) {
|
|
36
|
+
throw new Error(`Error rendering template: ${error.message}`);
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
/**
|
|
40
|
+
* Returns the rendered email html as string, based on the nunjucks templates
|
|
41
|
+
*
|
|
42
|
+
* @param {string} input The input
|
|
43
|
+
* @returns {string} Rendered email html as string
|
|
44
|
+
*/
|
|
45
|
+
renderFromString(input) {
|
|
46
|
+
// Render template
|
|
47
|
+
const renderedContent = nunjucks.renderString(input, {});
|
|
48
|
+
//console.log(renderedContent);
|
|
49
|
+
// Return the rendered template
|
|
50
|
+
return renderedContent;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
/**
|
|
54
|
+
* Renders the email html, based on an input template
|
|
55
|
+
*
|
|
56
|
+
* @param {string} templatePath The path of the template to used as input
|
|
57
|
+
* @returns {string} Rendered email html as string
|
|
58
|
+
*/
|
|
59
|
+
async renderFromFile(templatePath) {
|
|
60
|
+
// Load template
|
|
61
|
+
const templateContent = await fs.readFile(templatePath, 'utf8');
|
|
62
|
+
// Render template
|
|
63
|
+
const renderedContent = this.renderFromString(templateContent);
|
|
64
|
+
return renderedContent;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
/**
|
|
68
|
+
* Returns the rendered email html as string, based on the input json object
|
|
69
|
+
*
|
|
70
|
+
* @param {object} jsonInput The input object
|
|
71
|
+
* @returns {string} Rendered email html as string
|
|
72
|
+
*/
|
|
73
|
+
renderFromJson(jsonInput) {
|
|
74
|
+
//build the template from the jsonInput
|
|
75
|
+
let jsonTemplate = `{% extends "govcyBase.njk" %}
|
|
76
|
+
{% from "govcyEmailElement.njk" import govcyEmailElement %}
|
|
77
|
+
{% block lang %}${jsonInput.lang}{% endblock %}
|
|
78
|
+
{% block subject %}${jsonInput.subject}{% endblock %}
|
|
79
|
+
`
|
|
80
|
+
//if there is a pre-header
|
|
81
|
+
if (jsonInput.hasOwnProperty('pre')){
|
|
82
|
+
jsonTemplate += `{% block pre -%}{{ govcyEmailElement ('preHeader',{preText:'${jsonInput.pre}'}) }}{%- endblock %}`
|
|
83
|
+
}
|
|
84
|
+
//if there is a header
|
|
85
|
+
if (jsonInput.hasOwnProperty('header')){
|
|
86
|
+
jsonTemplate += `
|
|
87
|
+
{% block header -%}
|
|
88
|
+
{{ govcyEmailElement ('header',{serviceName:'${jsonInput.header.serviceName}',
|
|
89
|
+
name:'${jsonInput.header.name}',lang:'${jsonInput.lang}'}) }}
|
|
90
|
+
{%- endblock %}`
|
|
91
|
+
}
|
|
92
|
+
//if there is a success
|
|
93
|
+
if (jsonInput.hasOwnProperty('success')){
|
|
94
|
+
jsonTemplate += `
|
|
95
|
+
{% block success -%}
|
|
96
|
+
{{ govcyEmailElement ('success',{title:'${jsonInput.success.title}',
|
|
97
|
+
body:'${jsonInput.success.body}'}) }}
|
|
98
|
+
{%- endblock %}`
|
|
99
|
+
}
|
|
100
|
+
//if there is a footer
|
|
101
|
+
if (jsonInput.hasOwnProperty('footer')){
|
|
102
|
+
jsonTemplate += `
|
|
103
|
+
{% block footer -%}
|
|
104
|
+
{{ govcyEmailElement ('footer',{footerText:'${jsonInput.footer.footerText}'}) }}
|
|
105
|
+
{%- endblock %}`
|
|
106
|
+
}
|
|
107
|
+
//if there is a body
|
|
108
|
+
if (jsonInput.hasOwnProperty('body')){
|
|
109
|
+
jsonTemplate += `{% block body -%}
|
|
110
|
+
{% call govcyEmailElement('body') -%}`
|
|
111
|
+
// for each element in the body
|
|
112
|
+
jsonInput.body.forEach(bodyElement => {
|
|
113
|
+
//add body email element in template
|
|
114
|
+
jsonTemplate += `
|
|
115
|
+
{% call govcyEmailElement('${bodyElement.component}',${bodyElement.params}) -%}
|
|
116
|
+
${bodyElement.body}
|
|
117
|
+
{%- endcall %}
|
|
118
|
+
`
|
|
119
|
+
});
|
|
120
|
+
jsonTemplate += `{%- endcall%}
|
|
121
|
+
{% endblock -%}`
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
// Render template
|
|
125
|
+
const renderedContent = this.renderFromString(jsonTemplate);
|
|
126
|
+
return renderedContent;
|
|
127
|
+
}
|
|
128
|
+
}
|
package/src/index.mjs
ADDED
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
{# body Heading
|
|
2
|
+
@param {string} headinLevel The heading level. Optional, default is 1. Can be 1,2,3,4
|
|
3
|
+
@returns govcy body Heading for emails html
|
|
4
|
+
#}
|
|
5
|
+
{% macro gocvyEmailBodyHeading(params) -%}
|
|
6
|
+
{%- from "./bodyParagraph.njk" import gocvyEmailBodyParagraph -%}
|
|
7
|
+
{#- set default values -#}
|
|
8
|
+
{%- set headingLevel = params.headinLevel | default(1) -%}
|
|
9
|
+
{%- if headingLevel > 4 -%}
|
|
10
|
+
{%- set headingLevel = 4 -%}
|
|
11
|
+
{%- endif -%}
|
|
12
|
+
{# depending on the heading level set the font-size #}
|
|
13
|
+
{%- if headingLevel == 1 -%}
|
|
14
|
+
{%- set fontSize = '28px' -%}
|
|
15
|
+
{%- elif headingLevel == 2 -%}
|
|
16
|
+
{%- set fontSize = '24px' -%}
|
|
17
|
+
{%- elif headingLevel == 3 -%}
|
|
18
|
+
{%- set fontSize = '20px' -%}
|
|
19
|
+
{%- else -%}
|
|
20
|
+
{%- set fontSize = '18px' -%}
|
|
21
|
+
{%- endif -%}
|
|
22
|
+
{% call gocvyEmailBodyParagraph() %}
|
|
23
|
+
<h{{headingLevel}} style="font-size:{{fontSize}};font-weight:700;margin: 0;">
|
|
24
|
+
{{ caller() }}
|
|
25
|
+
</h{{headingLevel}}>
|
|
26
|
+
{% endcall %}
|
|
27
|
+
{%- endmacro %}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
{# body list
|
|
2
|
+
@param {string} type The list type. Optional, default is 'ul'. Can be 'ul', 'ol'
|
|
3
|
+
@param {array} items The array of items to turn onto list items
|
|
4
|
+
@returns govcy body List for emails html
|
|
5
|
+
#}
|
|
6
|
+
{% macro gocvyEmailBodyList(params) -%}
|
|
7
|
+
{%- from "./bodyParagraph.njk" import gocvyEmailBodyParagraph -%}
|
|
8
|
+
{#- set default values -#}
|
|
9
|
+
{%- set type = params.type | default('ul') -%}
|
|
10
|
+
{# depending on the heading level set the font-size #}
|
|
11
|
+
{%- if type == 'ol' -%}
|
|
12
|
+
{%- set openHTML = '<ol style="margin:0; margin-left: 16px; padding:0; line-height:22px;" align="left">' -%}
|
|
13
|
+
{%- set closeHTML = '</ol>' -%}
|
|
14
|
+
{%- else -%}
|
|
15
|
+
{%- set openHTML = '<ul style="margin:0; margin-left: 16px; padding:0; line-height:22px;" align="left" type="disc">' -%}
|
|
16
|
+
{%- set closeHTML = '</ul>' -%}
|
|
17
|
+
{%- endif -%}
|
|
18
|
+
{% call gocvyEmailBodyParagraph() %}
|
|
19
|
+
{{ openHTML | safe }}
|
|
20
|
+
{# for each item render list item #}
|
|
21
|
+
{%- for item in params.items -%}
|
|
22
|
+
{%- if item -%}
|
|
23
|
+
<li>{{ item | safe }}</li>
|
|
24
|
+
{%- endif -%}
|
|
25
|
+
{%- endfor -%}
|
|
26
|
+
{{ closeHTML | safe }}
|
|
27
|
+
{% endcall %}
|
|
28
|
+
{%- endmacro %}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
{# body Paragraph
|
|
2
|
+
@returns govcy body Paragraph for emails html
|
|
3
|
+
#}
|
|
4
|
+
{% macro gocvyEmailBodyParagraph() -%}
|
|
5
|
+
<tr>
|
|
6
|
+
<td align="center" valign="top" style="padding:10px 16px;">
|
|
7
|
+
<div style="font-family:Arial;font-size:16px;line-height:1.5;text-align:left;" >
|
|
8
|
+
{{ caller() }}
|
|
9
|
+
</div>
|
|
10
|
+
</td>
|
|
11
|
+
</tr>
|
|
12
|
+
{%- endmacro %}
|