fleet/server/mail/templates/password_reset.html
noahtalerman 23ce98ec51
Add Nunito Sans font and update global styles. (#59)
This is the first PR as a part of the Fleet UI Refresh #38.

Changes include:

- Add Nunito Sans font files and modify global styles to reflect the font change.
- Modify global font variables to reflect new sizing and weight naming conventions.
-- New sizing and naming conventions:
--- SIZE: xx-small: 12px, x-small: 14px, small: 16px, medium: 20px, large: 24px, x-large: 28px
--- WEIGHT: regular: 400, bold: 700
- Remove the old Oxygen font files.

Changes to other style sheets reflect the changes to the new font sizing and weight naming conventions for global variables. The changes don't necessarily use the correct size (as illustrated by mockups). Those "up to spec" sizing changes are to come.
2020-11-19 16:51:22 -08:00

76 lines
2.9 KiB
HTML

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;600;700&display=swap" rel="stylesheet">
<style>
body {
font-family: 'Nunito Sans', sans-serif;
}
h1 {
font-weight: normal;
margin: 20px 0 40px 0;
}
p {
line-height: 2.0;
}
a {
text-decoration: none;
color: #4a90e2;
}
a:hover {
text-decoration: underline;
}
@media only screen and (max-device-width: 480px) {
table {
width: 100% !important;
padding: 0 !important;
margin: 0 !important;
}
td {
width: 100% !important;
padding: 20px !important;
}
}
</style>
</head>
<body>
<table align="center" border="0" cellpadding="0" cellspacing="0" height="100%" width="100%" bgcolor="#f4f6fb" style="background: #f4f6fb; font-family: 'Nunito Sans', sans-serif; color: #66696f; border-collapse:collapse;">
<tr>
<td valign="top" align="center">
<table width="580" align="center" cellpadding="0" cellspacing="0" bgcolor="#ffffff" style="margin: 20px 10px;">
<tr>
<td colspan="2" bgcolor="#ffffff" style="padding:20px; font-family: 'Nunito Sans', sans-serif;">
<img src="{{.AssetURL}}/assets/images/kolide-logo-color@2x.png?raw=true" width="174" height="48" />
</td>
</tr>
<tr>
<td colspan="2" style="padding:60px; font-family: 'Nunito Sans', sans-serif;">
<h1 style="font-weight:300">Reset Your Fleet Password...</h1>
<p>Someone requested a password reset on your Fleet account. Follow the link below to reset your password:</p>
<p><a href="{{.BaseURL}}/login/reset?token={{.Token}}">Reset Password</a></p>
<p style="color:#9ca3ac"><em>If you did not make the request, you may ignore this email as no changes have been made.</em></p>
</td>
</tr>
<tr bgcolor="#9ca3ac">
<td valign="middle" align="left" style="padding:10px 20px; font-family: 'Nunito Sans', sans-serif; color: #fff;">
<a href="https://github.com/fleetdm/fleet/tree/master/docs" style="color: #fff; text-decoration: none;">Fleet Documentation</a>
</td>
<td valign="middle" align="right" style="padding:10px 20px; font-family: 'Nunito Sans', sans-serif;">
<a href="https://kolide.com" style="text-decoration: none;"><img src="{{.AssetURL}}/assets/images/kolide-white@2x.png?raw=true" width="122" height="33" /></a>
</td>
</tr>
</table>
<br>
</td>
</tr>
</table>
</body>
</html>