extern/zrok
1
1
Fork 0
mirror of https://github.com/openziti/zrok.git synced 2025-06-20 01:37:52 +02:00
Code Issues Packages Projects Releases Wiki Activity

reset password email styling (#157)

Browse Source
This commit is contained in:
Michael Quigley 2023-01-20 12:25:14 -05:00
parent 1789e79b98
commit 3a0bc3c1c8
No known key found for this signature in database
GPG Key ID: 9B60314A9DD20A62
2 changed files with 38 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

108
controller/emailUi/resetPassword.gohtml
View File

@ -1,12 +1,12 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head>
<head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Welcome to zrok!</title> <title>Password reset requested!</title>
<meta name="description" content="Please click to create your zrok account."> <meta name="description" content="Reset your zrok password.">
<meta name="viewport" content="width=device-width"> <meta name="viewport" content="width=device-width">
<link href="https://fonts.googleapis.com/css2?family=Russo+One&amp;display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono&display=swap" rel="stylesheet">
@ -14,7 +14,7 @@
body { body {
margin: 0; margin: 0;
padding: 25; padding: 25;
font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace; font-family: 'JetBrains Mono', 'Courier New', monospace;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
color: #ffffff; color: #ffffff;
@ -22,22 +22,6 @@
} }
tt,
code,
kbd,
samp {
font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: 'Russo One', sans-serif;
}
a:link { a:link {
color: #00d7e4; color: #00d7e4;
} }
@ -51,47 +35,6 @@
color: #ff0100; color: #ff0100;
} }
h1 {
font-size: 2em;
line-height: 1.3em;
color: #FFFFFF;
}
h2 {
font-family: 'JetBrains Mono', Consolas, 'Courier New', monospace;
font-size: 1.5em;
line-height: 1.3em;
color: #FFFFFF;
}
h3 {
font-size: 1.17em;
line-height: 1.3em;
}
hr {
border: 0;
border-bottom: 1px solid #ccc;
}
img {
max-width: 100%;
}
p code,
li code {
font-size: .875em;
background-color: #f5f5f5;
}
.site-title {
display: inline-block;
font-size: 5em;
line-height: 48px;
color: #ffffff;
margin: 0 .25em 0 0;
}
.claim { .claim {
font-size: 2em; font-size: 2em;
margin: 0.5em 0 1em 0; margin: 0.5em 0 1em 0;
@ -104,9 +47,7 @@
text-align: center; text-align: center;
} }
.cta {
margin: 1em 0;
}
.btn { .btn {
display: inline-block; display: inline-block;
@ -122,7 +63,7 @@
} }
.btn-primary { .btn-primary {
color: #FFF; color: #ffffff;
background-color: #ff0100; background-color: #ff0100;
border-color: #ff0100; border-color: #ff0100;
} }
@ -138,8 +79,10 @@
} }
.btn-secondary { .btn-secondary {
background-color: #ddd; background-color: #b3b3b3;
border-color: #ccc; border-color: #b3b3b3;
color: #252525;
font-weight: 800;
} }
a.btn-secondary:link, a.btn-secondary:link,
@ -184,9 +127,28 @@
} }
</style> </style>
</head> </head>
<body>
<h1>Someone requested a password reset on your behalf, {{ .EmailAddress }}!</h1> <body style="font-family: 'JetBrains Mono', 'Courier New', monospace; color: #ffffff; background-color: #3b2693; font-weight: 600;">
<p>Please click this to change your <code>zrok</code> account password.</p>
<div><a class="btn btn-primary" href="{{ .Url }}">Reset Password</a></div> <div class="container">
</body> <div class="banner" style="margin: auto;">
<img src="https://zrok.io/wp-content/uploads/2023/01/welcome.jpg" width="363px" height="500px" style="padding-bottom: 10px;"/>
</div>
<div class="cta" style="text-align: center;">
<p style="text-align: center;">Someone requested a password reset on your behalf, {{ .EmailAddress }}.</p>
<a class="btn btn-primary" href="{{ .Url }}" style="color: #ffffff;">Reset Password</a>
<a class="btn btn-secondary" href="#" style="color: #ffffff">Documentation</a>
</div>
<table border="0" cellpadding="0" cellspacing="0" align="center" class="about">
<tr>
<td><a href="https://github.com/openziti/zrok" target="_blank">github.com/openziti/zrok</a></td>
</tr>
<tr>
<td>{{ .Version }}</td>
</tr>
</table>
<p style="text-align: center;"></a>Copyright © 2023 <a href="http://www.netfoundry.io" target="_blank" style="color: #00d7e4;">NetFoundry, Inc.</a></p>
</div>
</body>
</html> </html>

3
controller/resetPasswordEmail.go
View File

@ -3,6 +3,7 @@ package controller
import ( import (
"bytes" "bytes"
"fmt" "fmt"
"github.com/openziti/zrok/build"
"html/template" "html/template"
"github.com/openziti/zrok/controller/emailUi" "github.com/openziti/zrok/controller/emailUi"
@ -14,12 +15,14 @@ import (
type resetPasswordEmail struct { type resetPasswordEmail struct {
EmailAddress string EmailAddress string
Url string Url string
Version string
} }
func sendResetPasswordEmail(emailAddress, token string) error { func sendResetPasswordEmail(emailAddress, token string) error {
emailData := &resetPasswordEmail{ emailData := &resetPasswordEmail{
EmailAddress: emailAddress, EmailAddress: emailAddress,
Url: fmt.Sprintf("%s/%s", cfg.ResetPassword.ResetUrlTemplate, token), Url: fmt.Sprintf("%s/%s", cfg.ResetPassword.ResetUrlTemplate, token),
Version: build.String(),
} }
plainBody, err := emailData.mergeTemplate("resetPassword.gotext") plainBody, err := emailData.mergeTemplate("resetPassword.gotext")