-
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathmagic_link_html.gohtml
128 lines (128 loc) · 8.89 KB
/
magic_link_html.gohtml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
{{- /*gotype: github.com/MicahParks/magiclinksdev/email.MagicLinkTemplateData*/ -}}
<!DOCTYPE html>
<html lang="en" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta charset="utf-8">
<meta name="x-apple-disable-message-reformatting">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="format-detection" content="telephone=no, date=no, address=no, email=no, url=no">
<meta name="color-scheme" content="light dark">
<meta name="supported-color-schemes" content="light dark">
{{.Meta.MSOHead}}
<title>{{.Meta.HTMLTitle}}</title>
<style>
.hover-bg-indigo-500:hover {
background-color: #6366f1 !important
}
.focus-visible-outline:focus-visible {
outline-style: solid !important
}
.focus-visible-outline-2:focus-visible {
outline-width: 2px !important
}
.focus-visible-outline-offset-2:focus-visible {
outline-offset: 2px !important
}
.focus-visible-outline-indigo-600:focus-visible {
outline-color: #4f46e5 !important
}
@media (max-width: 600px) {
.sm-my-8 {
margin-top: 32px !important;
margin-bottom: 32px !important
}
.sm-px-4 {
padding-left: 16px !important;
padding-right: 16px !important
}
.sm-px-6 {
padding-left: 24px !important;
padding-right: 24px !important
}
.sm-leading-8 {
line-height: 32px !important
}
}
</style>
</head>
<body style="margin: 0; width: 100%; background-color: #f8fafc; padding: 0; -webkit-font-smoothing: antialiased; word-break: break-word">
<div style="display: none">
{{.Meta.HTMLInstruction}}
 ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏  ͏
</div>
<div role="article" aria-roledescription="email" aria-label="Confirm your email address" lang="en">
<div class="sm-px-4" style="background-color: #f8fafc; font-family: ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif">
<table align="center" cellpadding="0" cellspacing="0" role="none">
<tr>
<td style="width: 552px; max-width: 100%">
{{- if .LogoImageURL}}
<div class="sm-my-8" style="margin-top: 48px; margin-bottom: 48px; text-align: center">
<a {{if .LogoClickURL}}href="{{.LogoClickURL}}"{{end}}>
<img src="{{.LogoImageURL}}" alt="{{.LogoAltText}}" style="max-width: 100%; vertical-align: middle; width: 100%">
</a>
</div>
{{- end}}
<table style="width: 100%;" cellpadding="0" cellspacing="0" role="none">
<tr>
<td class="sm-px-6" style="border-radius: 8px; background-color: #fffffe; padding: 48px; font-size: 16px; color: #334155; box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1)">
{{- if .Greeting}}
<p style="margin: 0 0 12px">
{{.Greeting}}
</p>
{{- end}}
<h1 class="sm-leading-8" style="margin: 0 0 24px; font-size: 24px; font-weight: 600; color: #000001">
{{.Title}}
</h1>
{{- if .Subtitle}}
<p style="margin: 0; line-height: 24px">
{{.Subtitle}}
</p>
{{- end}}
<div role="separator" style="line-height: 24px">‍</div>
<div>
<a href="{{.MagicLink}}" class="hover-bg-indigo-500 focus-visible-outline focus-visible-outline-2 focus-visible-outline-offset-2 focus-visible-outline-indigo-600" style="color: #f8fafc; background-color: #4f46e5; display: inline-block; border-radius: 6px; padding: 14px 18px; line-height: 1; font-size: 18px; font-weight: 600; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); text-decoration: none">
{{.Meta.MSOButtonStart}}
<span style="mso-text-raise: 16px">
{{.ButtonText}}
</span>
{{.Meta.MSOButtonStop}}
</a>
</div>
<div role="separator" style="height: 1px; line-height: 1px; margin: 32px 0; background-color: #e2e8f0">‍</div>
<p style="margin: 0 0 2px; font-size: 12px">
This link expires in {{.Expiration}}.
</p>
<p style="margin: 0 0 2px; font-size: 12px;">
Support will never ask for anything in this email.
</p>
<p style="margin: 0 0 2px; font-size: 12px;">
Never forward this email or share its contents with anyone.
</p>
{{- if .ReCATPTCHA}}
<p style="margin: 0 0 2px; font-size: 12px;">
This service is protected by reCAPTCHA and the Google
<a href="https://policies.google.com/privacy" style="text-decoration: none; color: #4338ca">Privacy Policy</a> and
<a href="https://policies.google.com/terms" style="text-decoration: none; color: #4338ca">Terms of Service</a> apply.
</p>
{{- end}}
</td>
</tr>
<tr role="separator">
<td style="line-height: 16px">‍</td>
</tr>
<tr>
<td style="padding-left: 24px; padding-right: 24px; text-align: center; font-size: 12px; color: #475569">
<p style="margin: 0 0 16px">
Powered by
<a href="https://magiclinks.dev" style="text-decoration: none; color: #4338ca">magiclinks.dev</a>
</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</div>
</body>
</html>