Skip to content

Commit dfceb2d

Browse files
feat: add npmx.dev branded email templates (#741)
Co-authored-by: Bailey Townsend <baileytownsend2323@gmail.com>
1 parent 306d537 commit dfceb2d

File tree

6 files changed

+1251
-0
lines changed

6 files changed

+1251
-0
lines changed
Lines changed: 203 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,203 @@
1+
<html dir="ltr" lang="en">
2+
<head>
3+
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type" />
4+
<meta name="x-apple-disable-message-reformatting" />
5+
<title>Confirm your email</title>
6+
<meta name="description" content="To confirm your email, enter the code provided in the app." />
7+
</head>
8+
<div
9+
style="
10+
display: none;
11+
overflow: hidden;
12+
line-height: 1px;
13+
opacity: 0;
14+
max-height: 0;
15+
max-width: 0;
16+
"
17+
>
18+
To confirm your email, enter the code provided in the app.
19+
<div>
20+
 ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏ ‌​‍‎‏
21+
</div>
22+
</div>
23+
24+
<body style="padding: 12px; padding-bottom: 40px; background-color: #0a0a0a">
25+
<table
26+
align="center"
27+
width="100%"
28+
border="0"
29+
cellpadding="0"
30+
cellspacing="0"
31+
role="presentation"
32+
style="max-width: 37.5em"
33+
>
34+
<tbody>
35+
<tr style="width: 100%">
36+
<td>
37+
<table
38+
align="center"
39+
width="100%"
40+
border="0"
41+
cellpadding="0"
42+
cellspacing="0"
43+
role="presentation"
44+
style="padding-top: 24px; padding-bottom: 24px"
45+
>
46+
<tbody>
47+
<tr>
48+
<td align="center">
49+
<img
50+
alt="npmx.dev's logo"
51+
src="https://npmx.dev/pwa-512x512.png"
52+
style="
53+
display: block;
54+
outline: none;
55+
border: none;
56+
text-decoration: none;
57+
width: 110px;
58+
margin: 0 auto;
59+
"
60+
/>
61+
</td>
62+
</tr>
63+
</tbody>
64+
</table>
65+
<table
66+
align="center"
67+
width="100%"
68+
border="0"
69+
cellpadding="0"
70+
cellspacing="0"
71+
role="presentation"
72+
style="
73+
padding: 24px;
74+
padding-bottom: 16px;
75+
border: solid 4px #262626;
76+
border-radius: 12px;
77+
background-color: #222222;
78+
"
79+
>
80+
<tbody>
81+
<tr>
82+
<td>
83+
<h1
84+
style="font-size:26px;letter-spacing:0.25px;color:#ffffff;font-family:-apple-system, BlinkMacSystemFont, &#x27;Roboto&#x27;, &#x27;Oxygen&#x27;, &#x27;Ubuntu&#x27;, &#x27;Cantarell&#x27;, &#x27;Fira Sans&#x27;, &#x27;Droid Sans&#x27;, &#x27;Helvetica Neue&#x27;, sans-serif;margin:0px 0px;line-height:1.0"
85+
>
86+
Confirm your email
87+
</h1>
88+
<p
89+
style="font-size:16px;line-height:1.4;margin:0px 0px;letter-spacing:0.25px;color:#fafafa;font-family:-apple-system, BlinkMacSystemFont, &#x27;Roboto&#x27;, &#x27;Oxygen&#x27;, &#x27;Ubuntu&#x27;, &#x27;Cantarell&#x27;, &#x27;Fira Sans&#x27;, &#x27;Droid Sans&#x27;, &#x27;Helvetica Neue&#x27;, sans-serif;padding-top:12px;padding-bottom:12px;padding-right:32px"
90+
>
91+
To confirm this email for your account, please enter the code below in the app
92+
</p>
93+
<code
94+
style="
95+
display: block;
96+
padding: 16px;
97+
border-radius: 8px;
98+
border-width: 1px;
99+
border-style: solid;
100+
background-color: #fafafa;
101+
border-color: hsl(211, 20%, 85.89999999999999%);
102+
font-size: 14px;
103+
letter-spacing: 0.25px;
104+
font-family: monospace;
105+
text-transform: uppercase;
106+
"
107+
>{{token}}</code
108+
>
109+
<p
110+
style="font-size:14px;line-height:1.4;margin:0px 0px;letter-spacing:0.25px;color:#fafafa;font-family:-apple-system, BlinkMacSystemFont, &#x27;Roboto&#x27;, &#x27;Oxygen&#x27;, &#x27;Ubuntu&#x27;, &#x27;Cantarell&#x27;, &#x27;Fira Sans&#x27;, &#x27;Droid Sans&#x27;, &#x27;Helvetica Neue&#x27;, sans-serif;padding-top:12px"
111+
>
112+
If you didn&#x27;t request an email confirmation, you can safely ignore this
113+
email.
114+
</p>
115+
<table
116+
align="center"
117+
width="100%"
118+
border="0"
119+
cellpadding="0"
120+
cellspacing="0"
121+
role="presentation"
122+
style="padding-top: 24px"
123+
>
124+
<tbody>
125+
<tr>
126+
<td>
127+
<hr
128+
style="
129+
width: 100%;
130+
border: none;
131+
border-top: 1px solid #fafafa;
132+
margin: 0;
133+
"
134+
/>
135+
<table
136+
align="center"
137+
width="100%"
138+
border="0"
139+
cellpadding="0"
140+
cellspacing="0"
141+
role="presentation"
142+
style="padding-top: 16px; vertical-align: middle"
143+
>
144+
<tbody style="width: 100%">
145+
<tr style="width: 100%">
146+
<td>
147+
<p
148+
style="font-size:14px;line-height:1.4;margin:0px 0px;color:#6a737d;font-family:-apple-system, BlinkMacSystemFont, &#x27;Roboto&#x27;, &#x27;Oxygen&#x27;, &#x27;Ubuntu&#x27;, &#x27;Cantarell&#x27;, &#x27;Fira Sans&#x27;, &#x27;Droid Sans&#x27;, &#x27;Helvetica Neue&#x27;, sans-serif;letter-spacing:0.25px"
149+
>
150+
<a
151+
href="https://npmx.dev"
152+
style="color:hsl(211, 20%, 53%);text-decoration:none;text-decoration-line:underline;font-family:-apple-system, BlinkMacSystemFont, &#x27;Roboto&#x27;, &#x27;Oxygen&#x27;, &#x27;Ubuntu&#x27;, &#x27;Cantarell&#x27;, &#x27;Fira Sans&#x27;, &#x27;Droid Sans&#x27;, &#x27;Helvetica Neue&#x27;, sans-serif;margin:0px 0px;line-height:1.0;font-size:14px;letter-spacing:0.25px"
153+
target="_blank"
154+
>npmx.dev</a
155+
>, a better browser for the npm registry
156+
</p>
157+
</td>
158+
<td align="center" style="width: 24px">
159+
<img
160+
alt="npmx.dev's logo"
161+
src="https://npmx.dev/pwa-512x512.png"
162+
style="
163+
display: block;
164+
outline: none;
165+
border: none;
166+
text-decoration: none;
167+
width: 24px;
168+
margin: 0 auto;
169+
"
170+
/>
171+
</td>
172+
</tr>
173+
</tbody>
174+
</table>
175+
</td>
176+
</tr>
177+
</tbody>
178+
</table>
179+
</td>
180+
</tr>
181+
</tbody>
182+
</table>
183+
<table
184+
align="center"
185+
width="100%"
186+
border="0"
187+
cellpadding="0"
188+
cellspacing="0"
189+
role="presentation"
190+
style="height: 500px"
191+
>
192+
<tbody>
193+
<tr>
194+
<td></td>
195+
</tr>
196+
</tbody>
197+
</table>
198+
</td>
199+
</tr>
200+
</tbody>
201+
</table>
202+
</body>
203+
</html>

0 commit comments

Comments
 (0)