Skip to content

Commit 45f0638

Browse files
feat: make email use color scheme
1 parent 93cf170 commit 45f0638

File tree

4 files changed

+92
-319
lines changed

4 files changed

+92
-319
lines changed

views/mail/reset_password.tpl.html

Lines changed: 63 additions & 243 deletions
Original file line numberDiff line numberDiff line change
@@ -1,251 +1,71 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
{{ template "head.tpl.html" . }}
3+
<head>
4+
{{ template "head.tpl.html" . }}
5+
<style>
6+
body {
7+
text-align: center;
8+
justify-content: center;
9+
background-color: #d6d7d7;
10+
font-family: sans-serif;
11+
-webkit-font-smoothing: antialiased;
12+
color: #2c240c;
13+
font-size: 14px;
14+
line-height: 1.4;
15+
margin: 0;
16+
padding: 0;
17+
-ms-text-size-adjust: 100%;
18+
-webkit-text-size-adjust: 100%;
19+
}
420

5-
<body
6-
class=""
7-
style="
8-
background-color: #f6f6f6;
9-
font-family: sans-serif;
10-
-webkit-font-smoothing: antialiased;
11-
font-size: 14px;
12-
line-height: 1.4;
13-
margin: 0;
14-
padding: 0;
15-
-ms-text-size-adjust: 100%;
16-
-webkit-text-size-adjust: 100%;
17-
"
18-
>
19-
<table
20-
border="0"
21-
cellpadding="0"
22-
cellspacing="0"
23-
class="body"
24-
style="
25-
border-collapse: separate;
26-
mso-table-lspace: 0pt;
27-
mso-table-rspace: 0pt;
21+
.content {
22+
display: flex;
23+
flex-direction: column;
24+
align-items: center;
25+
}
26+
27+
.main {
28+
border-radius: 3px;
2829
width: 100%;
29-
background-color: #f6f6f6;
30-
"
31-
>
32-
<tr>
33-
<td
34-
style="
35-
font-family: sans-serif;
36-
font-size: 14px;
37-
vertical-align: top;
38-
"
39-
>
40-
&nbsp;
41-
</td>
42-
<td
43-
class="container"
44-
style="
45-
font-family: sans-serif;
46-
font-size: 14px;
47-
vertical-align: top;
48-
display: block;
49-
margin: 0 auto;
50-
max-width: 580px;
51-
padding: 10px;
52-
width: 580px;
53-
"
54-
>
55-
{{ template "theader.tpl.html" . }}
30+
padding: 20px;
31+
}
32+
33+
.btn-primary {
34+
display: inline-block;
35+
background-color: #dd9821;
36+
border: solid 1px #9b5f00;
37+
color: #0e0901 !important;
38+
border-radius: 5px;
39+
box-sizing: border-box;
40+
cursor: pointer;
41+
text-decoration: none;
42+
font-size: 14px;
43+
font-weight: bold;
44+
margin: 0;
45+
padding: 12px 25px;
46+
text-transform: capitalize;
47+
border-color: #8f5d0c;
48+
}
49+
</style>
50+
</head>
51+
<body>
52+
{{ template "theader.tpl.html" . }}
5653

57-
<div
58-
class="content"
59-
style="
60-
box-sizing: border-box;
61-
display: block;
62-
margin: 0 auto;
63-
max-width: 580px;
64-
padding: 10px;
65-
justify-content: center;
66-
text-align: center;
67-
"
68-
>
69-
<table
70-
class="main"
71-
style="
72-
border-collapse: separate;
73-
mso-table-lspace: 0pt;
74-
mso-table-rspace: 0pt;
75-
width: 100%;
76-
background: #ffffff;
77-
border-radius: 3px;
78-
"
79-
>
80-
<tr>
81-
<td
82-
class="wrapper"
83-
style="
84-
font-family: sans-serif;
85-
font-size: 14px;
86-
vertical-align: top;
87-
box-sizing: border-box;
88-
padding: 20px;
89-
"
90-
>
91-
<table
92-
border="0"
93-
cellpadding="0"
94-
cellspacing="0"
95-
style="
96-
border-collapse: separate;
97-
mso-table-lspace: 0pt;
98-
mso-table-rspace: 0pt;
99-
width: 100%;
100-
"
101-
>
102-
<tr>
103-
<td
104-
style="
105-
font-family: sans-serif;
106-
font-size: 14px;
107-
vertical-align: top;
108-
"
109-
>
110-
<p
111-
style="
112-
font-family: sans-serif;
113-
font-size: 18px;
114-
font-weight: 500;
115-
margin: 0;
116-
margin-bottom: 15px;
117-
"
118-
>
119-
Password Reset
120-
</p>
121-
<p
122-
style="
123-
font-family: sans-serif;
124-
font-size: 14px;
125-
font-weight: normal;
126-
margin: 0;
127-
margin-bottom: 15px;
128-
"
129-
>
130-
You have requested to reset
131-
your Hackatime password.
132-
Please click the following
133-
link to proceed.
134-
</p>
135-
<table
136-
border="0"
137-
cellpadding="0"
138-
cellspacing="0"
139-
class="btn btn-primary"
140-
style="
141-
border-collapse: separate;
142-
mso-table-lspace: 0pt;
143-
mso-table-rspace: 0pt;
144-
width: 100%;
145-
box-sizing: border-box;
146-
"
147-
>
148-
<tbody>
149-
<tr>
150-
<td
151-
align="left"
152-
style="
153-
font-family: sans-serif;
154-
font-size: 14px;
155-
vertical-align: top;
156-
padding-bottom: 15px;
157-
"
158-
>
159-
<table
160-
border="0"
161-
cellpadding="0"
162-
cellspacing="0"
163-
style="
164-
border-collapse: separate;
165-
mso-table-lspace: 0pt;
166-
mso-table-rspace: 0pt;
167-
width: auto;
168-
"
169-
>
170-
<tbody>
171-
<tr>
172-
<td
173-
align="center"
174-
style="
175-
font-family: sans-serif;
176-
font-size: 14px;
177-
vertical-align: top;
178-
background-color: #2f855a;
179-
border-radius: 5px;
180-
text-align: center;
181-
"
182-
>
183-
<a
184-
href="{{ .ResetLink }}"
185-
target="_blank"
186-
style="
187-
display: inline-block;
188-
color: #ffffff;
189-
background-color: #2f855a;
190-
border: solid
191-
1px
192-
#2f855a;
193-
border-radius: 5px;
194-
box-sizing: border-box;
195-
cursor: pointer;
196-
text-decoration: none;
197-
font-size: 14px;
198-
font-weight: bold;
199-
margin: 0;
200-
padding: 12px
201-
25px;
202-
text-transform: capitalize;
203-
border-color: #2f855a;
204-
"
205-
>Reset
206-
Password</a
207-
>
208-
</td>
209-
</tr>
210-
</tbody>
211-
</table>
212-
</td>
213-
</tr>
214-
</tbody>
215-
</table>
216-
<p
217-
style="
218-
font-family: sans-serif;
219-
font-size: 14px;
220-
font-weight: normal;
221-
margin: 0;
222-
margin-bottom: 15px;
223-
"
224-
>
225-
If you did not request a
226-
password change, please just
227-
ignore this mail.
228-
</p>
229-
</td>
230-
</tr>
231-
</table>
232-
</td>
233-
</tr>
234-
</table>
54+
<main class="content">
55+
<h1>Password Reset</h1>
56+
<p>
57+
You have requested to reset your Hackatime password. Please
58+
click the following link to proceed.
59+
</p>
60+
<a href="{{ .ResetLink }}" target="_blank" class="btn-primary"
61+
>Reset Password</a
62+
>
63+
<p>
64+
If you did not request a password change, please just ignore
65+
this mail.
66+
</p>
67+
</main>
23568

236-
{{ template "tfooter.tpl.html" . }}
237-
</div>
238-
</td>
239-
<td
240-
style="
241-
font-family: sans-serif;
242-
font-size: 14px;
243-
vertical-align: top;
244-
"
245-
>
246-
&nbsp;
247-
</td>
248-
</tr>
249-
</table>
69+
{{ template "tfooter.tpl.html" . }}
25070
</body>
25171
</html>

views/mail/subscription_expiring.tpl.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<!doctype html>
1+
<!DOCTYPE html>
22
<html lang="en">
33
{{ template "head.tpl.html" . }}
44

@@ -140,9 +140,9 @@
140140
"
141141
>
142142
{{ if .HasExpired }} Your
143-
Wakapi subscription has
143+
Hackatime subscription has
144144
expired. {{ else }} Your
145-
Wakapi subscription will
145+
Hackatime subscription will
146146
expire soon. {{ end }} All
147147
coding activity older than
148148
{{ .DataRetentionMonths }}

views/mail/tfooter.tpl.html

Lines changed: 15 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,19 @@
11
<div
22
class="footer"
3-
style="clear: both; margin-top: 10px; text-align: center; width: 100%"
3+
style="
4+
display: flex;
5+
justify-content: center;
6+
align-items: center;
7+
width: 100%;
8+
height: 50px;
9+
"
410
>
5-
<table
6-
border="0"
7-
cellpadding="0"
8-
cellspacing="0"
9-
style="
10-
border-collapse: separate;
11-
mso-table-lspace: 0pt;
12-
mso-table-rspace: 0pt;
13-
width: 100%;
14-
"
15-
>
16-
<tr>
17-
<td
18-
class="content-block powered-by"
19-
style="
20-
font-family: sans-serif;
21-
vertical-align: top;
22-
padding-bottom: 10px;
23-
padding-top: 10px;
24-
font-size: 12px;
25-
color: #999999;
26-
text-align: center;
27-
"
28-
>
29-
Powered by
30-
<a
31-
href="https://github.com/kcoderhtml/hackatime"
32-
style="
33-
color: #999999;
34-
font-size: 12px;
35-
text-align: center;
36-
text-decoration: none;
37-
"
38-
>Hackatime</a
39-
>.
40-
</td>
41-
</tr>
42-
</table>
11+
<p style="font-size: 12px; color: #575140">
12+
Powered by
13+
<a
14+
href="https://github.com/kcoderhtml/hackatime"
15+
style="color: #706b5d; text-decoration: none"
16+
>Hackatime</a
17+
>.
18+
</p>
4319
</div>

0 commit comments

Comments
 (0)