mjmlhelper 2.3.0 → 2.3.1
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/ci.yml +42 -0
- package/.gitignore +18 -15
- package/README.md +1 -0
- package/boilerplate/_inc/bottom.mjml +18 -18
- package/boilerplate/_inc/button.mjml +6 -6
- package/boilerplate/_inc/columns-inline.mjml +47 -47
- package/boilerplate/_inc/columns.mjml +25 -25
- package/boilerplate/_inc/divider.mjml +24 -24
- package/boilerplate/_inc/responsive.mjml +70 -70
- package/boilerplate/_inc/simple.mjml +37 -37
- package/boilerplate/_inc/top.mjml +8 -8
- package/boilerplate/_inc/two-col-right.mjml +11 -11
- package/boilerplate/example.gitignore +9 -9
- package/boilerplate/example.mjmlhelper.json +27 -27
- package/boilerplate/index.mjml +113 -113
- package/mjmlhelper.js +576 -576
- package/package.json +1 -1
- package/LICENSE.md +0 -21
|
@@ -1,27 +1,27 @@
|
|
|
1
|
-
{
|
|
2
|
-
"from": "from@tld.com",
|
|
3
|
-
"name": "Testmailer",
|
|
4
|
-
"smtp": "your.hostname.com",
|
|
5
|
-
"username": "your-username",
|
|
6
|
-
"password": "your-password",
|
|
7
|
-
"port": 465,
|
|
8
|
-
"ssl": "tls",
|
|
9
|
-
|
|
10
|
-
"to": "to@tld.com",
|
|
11
|
-
"to": ["to@tld.com", "to2@tld.com"],
|
|
12
|
-
"to": "list.txt",
|
|
13
|
-
|
|
14
|
-
"images": false,
|
|
15
|
-
"images": "inline",
|
|
16
|
-
"images": "upload",
|
|
17
|
-
|
|
18
|
-
"log": "log.txt",
|
|
19
|
-
"ftp": {
|
|
20
|
-
"host": "localhost",
|
|
21
|
-
"port": 21,
|
|
22
|
-
"username": "foo",
|
|
23
|
-
"password": "bar",
|
|
24
|
-
"path": "/path/to/folder/",
|
|
25
|
-
"url": "https://tld.com/path/to/folder"
|
|
26
|
-
}
|
|
27
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"from": "from@tld.com",
|
|
3
|
+
"name": "Testmailer",
|
|
4
|
+
"smtp": "your.hostname.com",
|
|
5
|
+
"username": "your-username",
|
|
6
|
+
"password": "your-password",
|
|
7
|
+
"port": 465,
|
|
8
|
+
"ssl": "tls",
|
|
9
|
+
|
|
10
|
+
"to": "to@tld.com",
|
|
11
|
+
"to": ["to@tld.com", "to2@tld.com"],
|
|
12
|
+
"to": "list.txt",
|
|
13
|
+
|
|
14
|
+
"images": false,
|
|
15
|
+
"images": "inline",
|
|
16
|
+
"images": "upload",
|
|
17
|
+
|
|
18
|
+
"log": "log.txt",
|
|
19
|
+
"ftp": {
|
|
20
|
+
"host": "localhost",
|
|
21
|
+
"port": 21,
|
|
22
|
+
"username": "foo",
|
|
23
|
+
"password": "bar",
|
|
24
|
+
"path": "/path/to/folder/",
|
|
25
|
+
"url": "https://tld.com/path/to/folder"
|
|
26
|
+
}
|
|
27
|
+
}
|
package/boilerplate/index.mjml
CHANGED
|
@@ -1,113 +1,113 @@
|
|
|
1
|
-
<mjml owa="desktop">
|
|
2
|
-
<mj-head>
|
|
3
|
-
<mj-title>%PREVIEWTEXT%</mj-title>
|
|
4
|
-
<mj-preview>%PREVIEWTEXT%</mj-preview>
|
|
5
|
-
|
|
6
|
-
<!-- set manual breakpoint (important for gmx/web.de mobile) -->
|
|
7
|
-
<mj-breakpoint width="480px" />
|
|
8
|
-
|
|
9
|
-
<!-- custom fonts (only working for apple mail and iphone/ipad) -->
|
|
10
|
-
<mj-font name="Indie Flower" href="https://fonts.googleapis.com/css?family=Indie+Flower:400" />
|
|
11
|
-
<!-- prettier-ignore -->
|
|
12
|
-
<mj-style>
|
|
13
|
-
@font-face {
|
|
14
|
-
font-family: 'Custom';
|
|
15
|
-
font-style: normal;
|
|
16
|
-
font-weight: 400;
|
|
17
|
-
src: url('_assets/font.woff2') format('woff2');
|
|
18
|
-
}
|
|
19
|
-
</mj-style>
|
|
20
|
-
|
|
21
|
-
<mj-attributes>
|
|
22
|
-
<!-- be careful: always provide a good fallback font for outlook, e.g. arial -->
|
|
23
|
-
<mj-all
|
|
24
|
-
padding="0"
|
|
25
|
-
font-family="'Indie Flower', Custom, Arial, sans-serif"
|
|
26
|
-
color="#333333"
|
|
27
|
-
align="center"
|
|
28
|
-
vertical-align="top"
|
|
29
|
-
/>
|
|
30
|
-
<mj-body width="600px" background-color="#eee" />
|
|
31
|
-
<mj-wrapper padding="0px" background-color="transparent" />
|
|
32
|
-
<mj-section padding="20px" background-color="#ffffff" />
|
|
33
|
-
<mj-text font-size="16px" line-height="24px" font-weight="400" />
|
|
34
|
-
<mj-image width="560px" align="center" />
|
|
35
|
-
<mj-button
|
|
36
|
-
background-color="#1c58a0"
|
|
37
|
-
color="white"
|
|
38
|
-
font-size="14px"
|
|
39
|
-
align="center"
|
|
40
|
-
border="none"
|
|
41
|
-
border-radius="5px"
|
|
42
|
-
font-weight="bold"
|
|
43
|
-
/>
|
|
44
|
-
<mj-divider border-width="1px" border-style="solid" border-color="#d3d3d3" />
|
|
45
|
-
<mj-class name="big" font-size="18px" />
|
|
46
|
-
<mj-class name="small" font-size="12px" />
|
|
47
|
-
<mj-class name="smallest" font-size="9px" line-height="13px" />
|
|
48
|
-
<mj-class name="strong" font-weight="bold" />
|
|
49
|
-
</mj-attributes>
|
|
50
|
-
<!-- prettier-ignore -->
|
|
51
|
-
<mj-style>
|
|
52
|
-
@media all and (max-width: 500px) {
|
|
53
|
-
.mobile-hidden { display: none !important; }
|
|
54
|
-
}
|
|
55
|
-
a {
|
|
56
|
-
color: #333333;
|
|
57
|
-
text-decoration: none;
|
|
58
|
-
border: none;
|
|
59
|
-
}
|
|
60
|
-
.hover:hover td, .hover a:hover, .hover p:hover {
|
|
61
|
-
background-color:#00E18E !important;
|
|
62
|
-
}
|
|
63
|
-
</mj-style>
|
|
64
|
-
<!-- prettier-ignore -->
|
|
65
|
-
<mj-style inline="inline">
|
|
66
|
-
.link-nostyle {
|
|
67
|
-
color: #333333; text-decoration: none; border: none;
|
|
68
|
-
}
|
|
69
|
-
.box-shadow {
|
|
70
|
-
box-shadow: 0px 0px 30px 0px #cecece;
|
|
71
|
-
}
|
|
72
|
-
</mj-style>
|
|
73
|
-
</mj-head>
|
|
74
|
-
<mj-body>
|
|
75
|
-
<mj-include path="_inc/responsive.mjml" />
|
|
76
|
-
|
|
77
|
-
<mj-wrapper>
|
|
78
|
-
<mj-include path="_inc/top.mjml" />
|
|
79
|
-
</mj-wrapper>
|
|
80
|
-
|
|
81
|
-
<mj-wrapper css-class="box-shadow" background-color="#ffffff">
|
|
82
|
-
<!-- flexibles -->
|
|
83
|
-
<!-- flexible="Simple" -->
|
|
84
|
-
<mj-include path="_inc/simple.mjml" />
|
|
85
|
-
<!-- flexible="Button" -->
|
|
86
|
-
<mj-include path="_inc/button.mjml" />
|
|
87
|
-
<!-- flexible="Divider" -->
|
|
88
|
-
<mj-include path="_inc/divider.mjml" />
|
|
89
|
-
<!-- flexible="Columns" -->
|
|
90
|
-
<mj-include path="_inc/columns.mjml" />
|
|
91
|
-
<!-- flexible="Two Col Left" -->
|
|
92
|
-
<mj-include path="_inc/two-col-left.mjml" />
|
|
93
|
-
<!-- flexible="Two Col Right" -->
|
|
94
|
-
<mj-include path="_inc/two-col-right.mjml" />
|
|
95
|
-
<!-- flexible="Two Col Left" -->
|
|
96
|
-
<mj-include path="_inc/two-col-left.mjml" />
|
|
97
|
-
<!-- flexible="Two Col Right" -->
|
|
98
|
-
<mj-include path="_inc/two-col-right.mjml" />
|
|
99
|
-
<!-- flexible="Simple" -->
|
|
100
|
-
<mj-include path="_inc/simple.mjml" />
|
|
101
|
-
<!-- flexible="Columns Inline" -->
|
|
102
|
-
<mj-include path="_inc/columns-inline.mjml" />
|
|
103
|
-
<!-- /flexibles -->
|
|
104
|
-
|
|
105
|
-
<!-- this is intentionally not a flexible (just to test) -->
|
|
106
|
-
<mj-include path="_inc/simple.mjml" />
|
|
107
|
-
</mj-wrapper>
|
|
108
|
-
|
|
109
|
-
<mj-wrapper>
|
|
110
|
-
<mj-include path="_inc/bottom.mjml" />
|
|
111
|
-
</mj-wrapper>
|
|
112
|
-
</mj-body>
|
|
113
|
-
</mjml>
|
|
1
|
+
<mjml owa="desktop">
|
|
2
|
+
<mj-head>
|
|
3
|
+
<mj-title>%PREVIEWTEXT%</mj-title>
|
|
4
|
+
<mj-preview>%PREVIEWTEXT%</mj-preview>
|
|
5
|
+
|
|
6
|
+
<!-- set manual breakpoint (important for gmx/web.de mobile) -->
|
|
7
|
+
<mj-breakpoint width="480px" />
|
|
8
|
+
|
|
9
|
+
<!-- custom fonts (only working for apple mail and iphone/ipad) -->
|
|
10
|
+
<mj-font name="Indie Flower" href="https://fonts.googleapis.com/css?family=Indie+Flower:400" />
|
|
11
|
+
<!-- prettier-ignore -->
|
|
12
|
+
<mj-style>
|
|
13
|
+
@font-face {
|
|
14
|
+
font-family: 'Custom';
|
|
15
|
+
font-style: normal;
|
|
16
|
+
font-weight: 400;
|
|
17
|
+
src: url('_assets/font.woff2') format('woff2');
|
|
18
|
+
}
|
|
19
|
+
</mj-style>
|
|
20
|
+
|
|
21
|
+
<mj-attributes>
|
|
22
|
+
<!-- be careful: always provide a good fallback font for outlook, e.g. arial -->
|
|
23
|
+
<mj-all
|
|
24
|
+
padding="0"
|
|
25
|
+
font-family="'Indie Flower', Custom, Arial, sans-serif"
|
|
26
|
+
color="#333333"
|
|
27
|
+
align="center"
|
|
28
|
+
vertical-align="top"
|
|
29
|
+
/>
|
|
30
|
+
<mj-body width="600px" background-color="#eee" />
|
|
31
|
+
<mj-wrapper padding="0px" background-color="transparent" />
|
|
32
|
+
<mj-section padding="20px" background-color="#ffffff" />
|
|
33
|
+
<mj-text font-size="16px" line-height="24px" font-weight="400" />
|
|
34
|
+
<mj-image width="560px" align="center" />
|
|
35
|
+
<mj-button
|
|
36
|
+
background-color="#1c58a0"
|
|
37
|
+
color="white"
|
|
38
|
+
font-size="14px"
|
|
39
|
+
align="center"
|
|
40
|
+
border="none"
|
|
41
|
+
border-radius="5px"
|
|
42
|
+
font-weight="bold"
|
|
43
|
+
/>
|
|
44
|
+
<mj-divider border-width="1px" border-style="solid" border-color="#d3d3d3" />
|
|
45
|
+
<mj-class name="big" font-size="18px" />
|
|
46
|
+
<mj-class name="small" font-size="12px" />
|
|
47
|
+
<mj-class name="smallest" font-size="9px" line-height="13px" />
|
|
48
|
+
<mj-class name="strong" font-weight="bold" />
|
|
49
|
+
</mj-attributes>
|
|
50
|
+
<!-- prettier-ignore -->
|
|
51
|
+
<mj-style>
|
|
52
|
+
@media all and (max-width: 500px) {
|
|
53
|
+
.mobile-hidden { display: none !important; }
|
|
54
|
+
}
|
|
55
|
+
a {
|
|
56
|
+
color: #333333;
|
|
57
|
+
text-decoration: none;
|
|
58
|
+
border: none;
|
|
59
|
+
}
|
|
60
|
+
.hover:hover td, .hover a:hover, .hover p:hover {
|
|
61
|
+
background-color:#00E18E !important;
|
|
62
|
+
}
|
|
63
|
+
</mj-style>
|
|
64
|
+
<!-- prettier-ignore -->
|
|
65
|
+
<mj-style inline="inline">
|
|
66
|
+
.link-nostyle {
|
|
67
|
+
color: #333333; text-decoration: none; border: none;
|
|
68
|
+
}
|
|
69
|
+
.box-shadow {
|
|
70
|
+
box-shadow: 0px 0px 30px 0px #cecece;
|
|
71
|
+
}
|
|
72
|
+
</mj-style>
|
|
73
|
+
</mj-head>
|
|
74
|
+
<mj-body>
|
|
75
|
+
<mj-include path="_inc/responsive.mjml" />
|
|
76
|
+
|
|
77
|
+
<mj-wrapper>
|
|
78
|
+
<mj-include path="_inc/top.mjml" />
|
|
79
|
+
</mj-wrapper>
|
|
80
|
+
|
|
81
|
+
<mj-wrapper css-class="box-shadow" background-color="#ffffff">
|
|
82
|
+
<!-- flexibles -->
|
|
83
|
+
<!-- flexible="Simple" -->
|
|
84
|
+
<mj-include path="_inc/simple.mjml" />
|
|
85
|
+
<!-- flexible="Button" -->
|
|
86
|
+
<mj-include path="_inc/button.mjml" />
|
|
87
|
+
<!-- flexible="Divider" -->
|
|
88
|
+
<mj-include path="_inc/divider.mjml" />
|
|
89
|
+
<!-- flexible="Columns" -->
|
|
90
|
+
<mj-include path="_inc/columns.mjml" />
|
|
91
|
+
<!-- flexible="Two Col Left" -->
|
|
92
|
+
<mj-include path="_inc/two-col-left.mjml" />
|
|
93
|
+
<!-- flexible="Two Col Right" -->
|
|
94
|
+
<mj-include path="_inc/two-col-right.mjml" />
|
|
95
|
+
<!-- flexible="Two Col Left" -->
|
|
96
|
+
<mj-include path="_inc/two-col-left.mjml" />
|
|
97
|
+
<!-- flexible="Two Col Right" -->
|
|
98
|
+
<mj-include path="_inc/two-col-right.mjml" />
|
|
99
|
+
<!-- flexible="Simple" -->
|
|
100
|
+
<mj-include path="_inc/simple.mjml" />
|
|
101
|
+
<!-- flexible="Columns Inline" -->
|
|
102
|
+
<mj-include path="_inc/columns-inline.mjml" />
|
|
103
|
+
<!-- /flexibles -->
|
|
104
|
+
|
|
105
|
+
<!-- this is intentionally not a flexible (just to test) -->
|
|
106
|
+
<mj-include path="_inc/simple.mjml" />
|
|
107
|
+
</mj-wrapper>
|
|
108
|
+
|
|
109
|
+
<mj-wrapper>
|
|
110
|
+
<mj-include path="_inc/bottom.mjml" />
|
|
111
|
+
</mj-wrapper>
|
|
112
|
+
</mj-body>
|
|
113
|
+
</mjml>
|