From 4909c0a4c5a175cedfa88c93e5b4e858f7341b34 Mon Sep 17 00:00:00 2001
From: gillespi314 <73313222+gillespi314@users.noreply.github.com>
Date: Thu, 24 Jun 2021 14:56:26 -0500
Subject: [PATCH] Update email templates (#1175)

* Update email templates

* Update image file locations for email templates
---
 assets/images/fleet-logo-blue-118x41@2x.png   | Bin 0 -> 4482 bytes
 assets/images/fleet-mark-color-40x40@2x.png   | Bin 0 -> 895 bytes
 assets/images/slack-logo-41x40@2x.png         | Bin 0 -> 1233 bytes
 assets/images/twitter-logo-50x40@2x.png       | Bin 0 -> 1192 bytes
 .../templates/change_email_confirmation.html  | 147 ++++++++------
 .../images/fleet-logo-blue-118x42@2x.png      | Bin 0 -> 4463 bytes
 server/mail/templates/invite_token.html       | 187 +++++++++++-------
 server/mail/templates/password_reset.html     | 152 ++++++++------
 server/mail/templates/smtp_setup.html         | 121 +++++++-----
 9 files changed, 374 insertions(+), 233 deletions(-)
 create mode 100644 assets/images/fleet-logo-blue-118x41@2x.png
 create mode 100644 assets/images/fleet-mark-color-40x40@2x.png
 create mode 100644 assets/images/slack-logo-41x40@2x.png
 create mode 100644 assets/images/twitter-logo-50x40@2x.png
 create mode 100644 server/mail/templates/images/fleet-logo-blue-118x42@2x.png

diff --git a/assets/images/fleet-logo-blue-118x41@2x.png b/assets/images/fleet-logo-blue-118x41@2x.png
new file mode 100644
index 0000000000000000000000000000000000000000..d9ae53a2ba758098c8134f86c88107a7a8f75de2
GIT binary patch
literal 4482
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
UaHQxT)Bpeg07*qoM6N<$g0MQ4od5s;

literal 0
HcmV?d00001

diff --git a/assets/images/fleet-mark-color-40x40@2x.png b/assets/images/fleet-mark-color-40x40@2x.png
new file mode 100644
index 0000000000000000000000000000000000000000..fe875ef11e6dec1cbe3e454ddbbf99900cb5a06f
GIT binary patch
literal 895
zcmV-_1AzRAP)<h;3K|Lk000e1NJLTq001Ze001Zm1^@s6jQ+T700009a7bBm000&x
z000&x0ZCFM@Bjb+0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH0~AR_K~#7F?O4A{
z96=O*@9m{XBi>&SEK*nmY=WF9?EMc~L=s%AM684mu-V<hG{IEnN1@4vC;{_FWY8EB
z(g+Ep2}pY3>{96M<jvlCfpcbOxZ$|wKG@si&3wCW_s#qEV-QM2M`0M$AO;CjfH2M>
z!AG{+5bwZ(hab;EKE-@Y@lkLkLbg9YVdef<dlCjvizRch<f4RZ^2KJsMfJ1%EsQaT
zM0WuuCT|)d1!Ho5II%o23@3XF6GrZ@wGB=T6WthsOeVLVrnvk$j4*(=PyxJx=FXfD
zz466^-w|O@$pyG-?k(KC!Tq_q5fNb}w++zb>%$UQAZtbWZh*;FE^zs@TtX{1;AKO6
z4#AEoLp+25bBPz(g~P;gL%eUUbmS7R##4uh!VvG9i;i64iK%rOL1q}SawSrxi?<!P
zN^WSUAw*S@EI;Y)v|bBYLPT|vdAdJ;N6Wppy(we`SB)tx#OuKF3Cj%>9UV$um&m18
ziK_<y3l<N~SZ+F8=&UVOzO;ORN|bWbxi527>DAj+4*(;KFoGT3E<SnI3Il>TFKrK&
zmT7vuZnaF8?^i-e81vOSc1solo7EOyS-DOLet+JIbE&sme52(4dflj3mmgMRDW#T+
zh{>%7FYO<KssvBA&Le_q%arHPY&@=u-uU1Bl_)@qWopaj?MJT#^a%>UZkbf+wQ+E;
zOse!AAn9Oxa+7632g`&;yX6FOu{}5dyX6WZ2iwEnW}zQ&uuM`4@Bp=Q2irqIri-_8
zY2^}P1|A^Qoq0u)YHWIaOsi+AJ6U4PmWjuFweY`CZ?z&eh)Zm<3frT~$E8hm^3sb!
zZd6BOX}6?2Rh99Pmk~x7!4cgqo^5^N?(OU{L20*mI6JP-dRrzR6ba6>j?@P|G0aK6
z)aSe`lMis_{4j!`+A^_OXnw8F2^a!+gUW815Wvea`M}9;A^2G)AE@oOfm<dYs5fZ0
zTjt%ZfrF&OE)xZQmdOWHc4t+R>G9a`w6H7GGp)mjcifk-Xc~FJ|4-H19hSUY;~$8M
V6&l>Ta`6BF002ovPDHLkV1ndwlZF5Q

literal 0
HcmV?d00001

diff --git a/assets/images/slack-logo-41x40@2x.png b/assets/images/slack-logo-41x40@2x.png
new file mode 100644
index 0000000000000000000000000000000000000000..76dd5411df306b0c21257d6c0f496cc660a7c6bb
GIT binary patch
literal 1233
zcmV;?1TOoDP)<h;3K|Lk000e1NJLTq001cf001Zm1^@s6V?5JS00009a7bBm000&x
z000&x0ZCFM@Bjb+0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH1ZGJ@K~#7F?N~u?
z8$}fUW^CLDDeXo|C6Fjx-#CEl9!M`mINU&#+MHT0P5wZfaBs4%;GX;e;&NyX9Grrn
z+-#%<34v6T=D;nRATF(tZ6QJBdiU{W*ACv`b$9HID<nQ?JiFevGvCh4d*8ef7y)zN
zH}XWHD1aQ_+5}O1+ICm!^E1t!jajkymyFX>R0Pp7-xyp!fRG!z@7=l$4M=EWZl|>d
z5|u7NkB<N?q*9{VZ#R9)5!0vK3KO$Df(k-hWa68dZ*DF_16m}r)dqJ)3t^8h-EVlE
zzwz}=Hp4>ShxCL0#%i{*Y~UnFCX>i=Wri9EdBJBvg3E;=O&LyVI*+LRB1X6%)4LEp
z5yS+ok?eF(=c<VbLyM&HUO`mCgrV)-KU|(!C!$3nZ&W9Ok=EpomuJdcl`$b`kL2?}
zU?f!>OeK&b4bLP2`=_^NY8Vqeg)$OOPTfColJ#E-mK`8@X{S|ml{yF*0@0yt=XRPl
zuhRlAgOS#0=G#^Nb&GJxav{6{N+li2+*>W}zI&_WP4}Dk8w&(l=LkG%Y%_%rRbP?x
zpwx*RT4aLj2+knu0j((s_1B~jMT`$4m4cQg`%L)rAeKTO153&7RTl9;za2r(de7{6
zw~ZLU{n_3Hd1a_FkxMqBq3M%!No#)>28XciHOC(4y0|;U)ZV-DNevOeAHMC8Y<Iva
zf=DlggG#+nw0GrGNJ&);me7VI`5~f!H_4)%_&5-4l$T2(--ZszZK)9)6f3j$EM;K2
zuCvU$_cQFS2eO@9uNSPNrNG{;IDB^eU3RCM?hgKcJPU#8-amIe&%=E6xRH5yXE9)B
z<PCZH#UeYg$s*8#(<!Ha`{G|}^SI(gmK@1WUJ7vrI*_6^`~L3j07?7Y^(rrf+#q`<
zd1SZ$(lt}0q)NKXej7Hh&L7@6a+Ke{%Bad>hg`#`AUsI8@*U5+4_^IfEsWrC3?k^a
z2W$V8YdLk@sJsT*X{W~`=yisR9qIbA$etG|De96iL)(<{hN?R<CAh>PwLErM>M9P!
zBa6aM#C*YtEfF((l0>y|o5=F@4}_W={EQgDA8U7~8yg7i4;D1>f+JNa6OFwmAR%FS
zB-6icZ8K5jnf;rBCWn`m^M_m7QGcdT#}oFS4tu5sQ94!{F0jI3=<{HlH1h^JQ(0cE
z1`>bO()M;>C!-vPoueAsji8!&ur=TR*W=3Ts><=6(L{7K{y^fpbfNC`AINdKq-ux}
zXA656x6S`vwip*4-OZ?Fv?&E{1Rk)0Ac2jZ+(pG?N0JqUPqj85eVJKqRHBFG=P}(J
zRiJX%lR2M^5r&g+BA-vjN|Fx<TG5Tsh-#`wGC4K$d{RPGyqXg+F2fQrJarS1WmAh}
z+Ab><3Ok>y_ta^&@DS|9oH-8M6Yzke^m3tY<0MFWL=U$(vvk!?y|)u@DoG{zXFzFY
vKX}Mw#JnQJWnYo=LXgD5*{i!+2eE$xSj4P9uqO7;00000NkvXXu0mjfKdL&s

literal 0
HcmV?d00001

diff --git a/assets/images/twitter-logo-50x40@2x.png b/assets/images/twitter-logo-50x40@2x.png
new file mode 100644
index 0000000000000000000000000000000000000000..f8f5acf869b7edc13c4dfa7fbf92392f17f93f2c
GIT binary patch
literal 1192
zcmV;Z1XufsP)<h;3K|Lk000e1NJLTq001%o001Zm1^@s6ymF~b00009a7bBm000&x
z000&x0ZCFM@Bjb+0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH1U*SaK~#7F&6rJY
z+eQ?}|1+f1O@aCb5tDXZH5UleRnbjsAa*`%BXTa_x)-pN0~GSAyV@zFwy_OZH;{aS
zD(eQNz01xDVlNVjoV-U;vZ#m@MU6gwfWVRFaWsFvH*bbdV8#?q9lk7gTs(&dTL5__
zkPEw;P&ii-wdy15RpK}Y!8nK8R*M?~Gi3ARf-gHzUXdq}WUBy&W>*>%6h4StyRC|l
zM!ovzw%;ESvU%*(O%vOPtJXO*vvuU~fBivEzc9vaqz5IMQwd!!Dy&f3Rtipa-MZ5?
zl-<U&qqhY%=yY&OZd-<K1b!P+L~s{SblY%fUY8`I%yR?_l(N)s*b^e9@i1)WJ71$t
zF3dp_6jD3%Xn#RQ`qog0_mV@3!;C)uLzg$!5#xNjqel#np_G?d!~hgg*fmXA-l7O1
zFV)*0124-yqkR7zf)^ASZXW+<V*)<4UCvB7Xn;gqNQE5^GbM}zn&f5miN)a-5z-pG
zF_?f!Vw^o>L<-|MG{N)fh8c<a_v!;)^!}&MsFg5AapTx=Hcp%@ld_>17IA%rA8X+r
z!t~Pb#_RtNg%oKf+5kGG%G!60QHHz_{cNKX<&`VzcXtPW?g^prvFTDrdYa_s@{)nG
zxP9lz-%gJ900;U|l{HHa>xgWK8%K^KM5cw=ppj}&oi~G?q6eg)k60mQ{}&Rmjq$wF
z#iqcuc{rLle{a&KMIJk+-#L!;Z?FSI)REc-T}qf7PUW^xeva2EA~qrQgiuC0;5~!H
z6ro3qe&}Qz*L9PA{ll2QXK<Fek3~eJ@CbsqW;hgVEF#K#6W4Vk#KRdD8zse3Bd)V2
z#JuGnk&|}!x$~*xj`j#`YAy20J{A>)=08v4U-%;FH}pyqiwC_4cz-4tM1-(c=xnsA
z64KnfaFwhj^?$M5v-_5o@Pkq+v5GNc8cAWr3_Z87XR7OW3e<eC0D`DGWQ<(9L(4%=
zU%y?EhVhW%^1YDq8`>=S$dSh!7_64WVGjH8t6N5c*2;kpav3_$uH&PGa(_)@7#muP
zkc#Q_d{}w>Z7q$hjO(a8_79H@%#TZ|XT3~oER#Cv?QRwG*;kYja(7gw>L*bMhZu=@
z0O8Fx%#^p^t?8yEbrGB2zYRkbg%DhkoZ1^7S4gUB);)|#rfU4NBPTB<_QHa)HaOK@
zU*leXnI|m<#v~|#;&*EP1dXsKTo*r|Y+3J+fz%!eYg9W3iqU#QOW>5NhFLsuGeiPB
zdAIGZsG#g=V=8!5?7LgUgb0fFf&sVp1LeJ(GUV-PA4_;WQ2FUaSh<-P-y<xB8haUw
zbK}C{vwwAk@+6@&NF=nTENChMx(r<-TnDD(dx5&|PbiA3jWr6>SGqzdj*(f5_YC-J
z#mh?}zekX<a)@TG7EQKAFAh!5^Dd+`9lD<VwQkMqc=H+2u(S?IJ_hgr0000<MNUMn
GLSTYk@gXVz

literal 0
HcmV?d00001

diff --git a/server/mail/templates/change_email_confirmation.html b/server/mail/templates/change_email_confirmation.html
index 2532b68c64..7a77d93e4f 100644
--- a/server/mail/templates/change_email_confirmation.html
+++ b/server/mail/templates/change_email_confirmation.html
@@ -9,24 +9,31 @@
     <style>
       body {
         font-family: "Nunito Sans", sans-serif;
+        margin: 0;
       }
 
       h1 {
-        font-weight: normal;
-        margin: 20px 0 40px 0;
+        font-weight: 700;
+        font-size: 24px;
+        line-height: 32px;
+        margin: 0;
+        padding-bottom: 32px;
       }
 
       p {
-        line-height: 2;
+        font-size: 16px;
+        line-height: 22px;
+        margin: 0;
+        padding-bottom: 32px;
       }
 
       a {
         text-decoration: none;
-        color: #4a90e2;
+        color: #6a67fe;
       }
 
       a:hover {
-        text-decoration: underline;
+        text-decoration: none;
       }
 
       @media only screen and (max-device-width: 480px) {
@@ -43,7 +50,7 @@
       }
     </style>
   </head>
-  <body>
+  <body style="color: #192147">
     <table
       align="center"
       border="0"
@@ -55,7 +62,6 @@
       style="
         background: #f9fafc;
         font-family: 'Nunito Sans', sans-serif;
-        color: #66696f;
         border-collapse: collapse;
       "
     >
@@ -67,74 +73,99 @@
             cellpadding="0"
             cellspacing="0"
             bgcolor="#ffffff"
-            style="margin: 20px 10px"
+            style="
+              margin: 20px 20px;
+              border: 1px solid #e2e4ea;
+              border-radius: 8px;
+            "
           >
             <tr>
               <td
                 colspan="2"
                 bgcolor="#ffffff"
-                style="padding: 20px; font-family: 'Nunito Sans', sans-serif"
+                style="
+                  padding-top: 40px;
+                  padding-left: 48px;
+                  font-family: 'Nunito Sans', sans-serif;
+                  border-radius: 8px 8px 0px 0px;
+                "
               >
-                <img
-                  src="{{.AssetURL}}/assets/images/fleet-logo-color@2x.png?raw=true"
-                  width="174"
-                  height="48"
-                />
+                <a href="https://fleetdm.com" target="_blank">
+                  <img
+                    alt="Fleet logo"
+                    src="{{.AssetURL}}/assets/images/fleet-logo-blue-118x41@2x.png?raw=true"
+                    style="height: 41px; width: 118px"
+                  />
+                </a>
               </td>
             </tr>
             <tr>
               <td
                 colspan="2"
-                style="padding: 60px; font-family: 'Nunito Sans', sans-serif"
-              >
-                <h1>Change Confirmation</h1>
-                <p><strong>Hello,</strong></p>
-                <p>
-                  This message is to confirm that the email address you recently
-                  changed actually works. Please click the link below to confirm
-                  that you want to change your email address in Fleet.
-                </p>
-                <table bgcolor="#F9FAFC" height="100px" cellpadding="20px">
-                  <tr>
-                    <td style="font-family: 'Nunito Sans', sans-serif">
-                      <a href="{{.BaseURL}}/email/change/{{.Token}}"
-                        >{{.BaseURL}}/email/change/{{.Token}}</a
-                      >
-                    </td>
-                  </tr>
-                </table>
-              </td>
-            </tr>
-            <tr bgcolor="#9ca3ac">
-              <td
-                valign="middle"
-                align="left"
                 style="
-                  padding: 10px 20px;
+                  padding-top: 48px;
+                  padding-bottom: 48px;
+                  padding-left: 48px;
+                  padding-right: 48px;
                   font-family: 'Nunito Sans', sans-serif;
-                  color: #fff;
                 "
               >
+                <h1>Confirm your updated email address</h1>
+                <p>Please click below to confirm your updated email address.</p>
                 <a
-                  href="https://github.com/fleetdm/fleet/tree/main/docs"
-                  style="color: #fff; text-decoration: none"
-                  >Fleet Documentation</a
+                  href="{{.BaseURL}}/email/change/{{.Token}}"
+                  target="_blank"
+                  style="
+                    font-weight: 700;
+                    color: #fff;
+                    text-decoration: none;
+                    border-radius: 4px;
+                    -webkit-border-radius: 4px;
+                    background-color: #6a67fe;
+                    border-top: 8px solid #6a67fe;
+                    border-bottom: 8px solid #6a67fe;
+                    border-right: 16px solid #6a67fe;
+                    border-left: 16px solid #6a67fe;
+                    display: inline-block;
+                  "
                 >
-              </td>
-              <td
-                valign="middle"
-                align="right"
-                style="
-                  padding: 10px 20px;
-                  font-family: 'Nunito Sans', sans-serif;
-                "
-              >
-                <a href="https://fleetdm.com" style="text-decoration: none"
-                  ><img
-                    src="{{.AssetURL}}/assets/images/fleet-logo-text-all-white@2x.png?raw=true"
-                    width="122"
-                    height="33"
-                /></a>
+                  Confirm email
+                </a>
+
+                <div
+                  style="border-bottom: 1px solid #e2e4ea; padding-top: 32px"
+                ></div>
+                <div style="padding-top: 32px; padding-bottom: 32px">
+                  <a href="https://github.com/fleetdm/fleet" target="_blank">
+                    <img
+                      alt="Fleet logo"
+                      style="height: 20px; width: 20px; padding-right: 20px"
+                      src="{{.AssetURL}}/assets/images/fleet-mark-color-40x40@2x.png?raw=true"
+                    />
+                  </a>
+                  <a href="https://twitter.com/fleetctl" target="_blank">
+                    <img
+                      alt="Twitter logo"
+                      style="height: 20px; width: 25px; padding-right: 20px"
+                      src="{{.AssetURL}}/assets/images/twitter-logo-50x40@2x.png?raw=true"
+                    />
+                  </a>
+                  <a
+                    href="https://osquery.slack.com/join/shared_invite/zt-h29zm0gk-s2DBtGUTW4CFel0f0IjTEw#/"
+                    target="_blank"
+                  >
+                    <img
+                      alt="Slack logo"
+                      style="height: 20px; width: 20.5px; padding-right: 20px"
+                      src="{{.AssetURL}}/assets/images/slack-logo-41x40@2x.png?raw=true"
+                    />
+                  </a>
+                </div>
+                <p style="font-size: 12px; line-height: 16px; padding: 0">
+                  © 2021 Fleet Device Management Inc. <br />
+                  All trademarks, service marks, and company names are the
+                  property of their respective owners.
+                </p>
               </td>
             </tr>
           </table>
diff --git a/server/mail/templates/images/fleet-logo-blue-118x42@2x.png b/server/mail/templates/images/fleet-logo-blue-118x42@2x.png
new file mode 100644
index 0000000000000000000000000000000000000000..91b0df7d13bd2c03e7b2341ab8fa1b6e1cdfed22
GIT binary patch
literal 4463
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
BgV_K8

literal 0
HcmV?d00001

diff --git a/server/mail/templates/invite_token.html b/server/mail/templates/invite_token.html
index ac62f65e70..222c3e0884 100644
--- a/server/mail/templates/invite_token.html
+++ b/server/mail/templates/invite_token.html
@@ -9,24 +9,31 @@
     <style>
       body {
         font-family: "Nunito Sans", sans-serif;
+        margin: 0;
       }
 
       h1 {
-        font-weight: normal;
-        margin: 20px 0 40px 0;
+        font-weight: 700;
+        font-size: 24px;
+        line-height: 32px;
+        margin: 0;
+        padding-bottom: 32px;
       }
 
       p {
-        line-height: 2;
+        font-size: 16px;
+        line-height: 22px;
+        margin: 0;
+        padding-bottom: 32px;
       }
 
       a {
         text-decoration: none;
-        color: #4a90e2;
+        color: #6a67fe;
       }
 
       a:hover {
-        text-decoration: underline;
+        text-decoration: none;
       }
 
       @media only screen and (max-device-width: 480px) {
@@ -43,7 +50,7 @@
       }
     </style>
   </head>
-  <body>
+  <body style="color: #192147">
     <table
       align="center"
       border="0"
@@ -55,7 +62,6 @@
       style="
         background: #f9fafc;
         font-family: 'Nunito Sans', sans-serif;
-        color: #66696f;
         border-collapse: collapse;
       "
     >
@@ -67,82 +73,129 @@
             cellpadding="0"
             cellspacing="0"
             bgcolor="#ffffff"
-            style="margin: 20px 10px"
+            style="
+              margin: 20px 20px;
+              border: 1px solid #e2e4ea;
+              border-radius: 8px;
+            "
           >
             <tr>
               <td
                 colspan="2"
                 bgcolor="#ffffff"
-                style="padding: 20px; font-family: 'Nunito Sans', sans-serif"
+                style="
+                  padding-top: 40px;
+                  padding-left: 48px;
+                  font-family: 'Nunito Sans', sans-serif;
+                  border-radius: 8px 8px 0px 0px;
+                "
               >
-                <img
-                  src="{{.AssetURL}}/assets/images/fleet-logo-color@2x.png?raw=true"
-                  width="174"
-                  height="48"
-                />
+                <a href="https://fleetdm.com" target="_blank">
+                  <img
+                    alt="Fleet logo"
+                    src="{{.AssetURL}}/assets/images/fleet-logo-blue-118x41@2x.png?raw=true"
+                    style="height: 41px; width: 118px"
+                  />
+                </a>
               </td>
             </tr>
             <tr>
               <td
                 colspan="2"
-                style="padding: 60px; font-family: 'Nunito Sans', sans-serif"
+                style="
+                  padding-top: 48px;
+                  padding-bottom: 48px;
+                  padding-left: 48px;
+                  padding-right: 48px;
+                  font-family: 'Nunito Sans', sans-serif;
+                "
               >
-                <h1>You Have Been Invited To Fleet!</h1>
-                <p><strong>Hello,</strong></p>
+                <h1>You have been invited to Fleet!</h1>
+                <p>Hello,</p>
                 <p>
-                  {{.InvitedByUsername}} has invited you to join
-                  <strong>{{.OrgName}}</strong>. Please click the link below to
-                  accept the invitation and setup your account.
+                  <strong style="text-transform: capitalize;">{{.InvitedByUsername}} </strong>has invited you to join <strong>{{.OrgName}}</strong>.
                 </p>
-                <table bgcolor="#F9FAFC" height="100px" cellpadding="20px">
-                  <tr>
-                    <td style="font-family: 'Nunito Sans', sans-serif">
-                      {{if .SSOEnabled}}
-                      <a
-                        href="{{.BaseURL}}/login/ssoinvites/{{.Token}}?name={{.Name}}&email={{.Email}}"
-                        >{{.BaseURL}}/login/ssoinvites/{{.Token}}?name={{.Name}}&email={{.Email}}</a
-                      >
-                      {{else}}
-                      <a
-                        href="{{.BaseURL}}/login/invites/{{.Token}}?name={{.Name}}&email={{.Email}}"
-                        >{{.BaseURL}}/login/invites/{{.Token}}?name={{.Name}}&email={{.Email}}</a
-                      >
-                      {{end}}
-                    </td>
-                  </tr>
-                </table>
-              </td>
-            </tr>
-            <tr bgcolor="#9ca3ac">
-              <td
-                valign="middle"
-                align="left"
-                style="
-                  padding: 10px 20px;
-                  font-family: 'Nunito Sans', sans-serif;
-                  color: #fff;
-                "
-              >
+                <p>
+                  Please click the button below to accept the invitation and
+                  setup your account.
+                </p>
+
+                {{if .SSOEnabled}}
                 <a
-                  href="https://github.com/fleetdm/fleet/tree/main/docs"
-                  style="color: #fff; text-decoration: none"
-                  >Fleet Documentation</a
+                  href="{{.BaseURL}}/login/ssoinvites/{{.Token}}?name={{.Name}}&email={{.Email}}"
+                  target="_blank"
+                  style="
+                    font-weight: 700;
+                    color: #fff;
+                    text-decoration: none;
+                    border-radius: 4px;
+                    -webkit-border-radius: 4px;
+                    background-color: #6a67fe;
+                    border-top: 8px solid #6a67fe;
+                    border-bottom: 8px solid #6a67fe;
+                    border-right: 16px solid #6a67fe;
+                    border-left: 16px solid #6a67fe;
+                    display: inline-block;
+                  "
                 >
-              </td>
-              <td
-                valign="middle"
-                align="right"
-                style="
-                  padding: 10px 20px;
-                  font-family: 'Nunito Sans', sans-serif;
-                "
-              >
-                <a href="https://fleetdm.com" style="text-decoration: none"
-                  ><img
-                    src="{{.AssetURL}}/assets/images/fleet-logo-text-all-white@2x.png?raw=true"
-                    width="122"
-                    height="33"
-                /></a>
+                  Accept invitation
+                </a>
+                {{else}}
+                <a
+                  href="{{.BaseURL}}/login/invites/{{.Token}}?name={{.Name}}&email={{.Email}}"
+                  target="_blank"
+                  style="
+                    font-weight: 700;
+                    color: #fff;
+                    text-decoration: none;
+                    border-radius: 4px;
+                    -webkit-border-radius: 4px;
+                    background-color: #6a67fe;
+                    border-top: 8px solid #6a67fe;
+                    border-bottom: 8px solid #6a67fe;
+                    border-right: 16px solid #6a67fe;
+                    border-left: 16px solid #6a67fe;
+                    display: inline-block;
+                  "
+                >
+                  Accept invitation
+                </a>
+                {{end}}
+                
+                <div
+                  style="border-bottom: 1px solid #e2e4ea; padding-top: 32px"
+                ></div>
+                <div style="padding-top: 32px; padding-bottom: 32px">
+                  <a href="https://github.com/fleetdm/fleet" target="_blank">
+                    <img
+                      alt="Fleet logo"
+                      style="height: 20px; width: 20px; padding-right: 20px"
+                      src="{{.AssetURL}}/assets/images/fleet-mark-color-40x40@2x.png?raw=true"
+                    />
+                  </a>
+                  <a href="https://twitter.com/fleetctl" target="_blank">
+                    <img
+                      alt="Twitter logo"
+                      style="height: 20px; width: 25px; padding-right: 20px"
+                      src="{{.AssetURL}}/assets/images/twitter-logo-50x40@2x.png?raw=true"
+                    />
+                  </a>
+                  <a
+                    href="https://osquery.slack.com/join/shared_invite/zt-h29zm0gk-s2DBtGUTW4CFel0f0IjTEw#/"
+                    target="_blank"
+                  >
+                    <img
+                      alt="Slack logo"
+                      style="height: 20px; width: 20.5px; padding-right: 20px"
+                      src="{{.AssetURL}}/assets/images/slack-logo-41x40@2x.png?raw=true"
+                    />
+                  </a>
+                </div>
+                <p style="font-size: 12px; line-height: 16px; padding: 0">
+                  © 2021 Fleet Device Management Inc. <br />
+                  All trademarks, service marks, and company names are the
+                  property of their respective owners.
+                </p>
               </td>
             </tr>
           </table>
diff --git a/server/mail/templates/password_reset.html b/server/mail/templates/password_reset.html
index ee9d918eff..da5716d211 100644
--- a/server/mail/templates/password_reset.html
+++ b/server/mail/templates/password_reset.html
@@ -9,24 +9,31 @@
     <style>
       body {
         font-family: "Nunito Sans", sans-serif;
+        margin: 0;
       }
 
       h1 {
-        font-weight: normal;
-        margin: 20px 0 40px 0;
+        font-weight: 700;
+        font-size: 24px;
+        line-height: 32px;
+        margin: 0;
+        padding-bottom: 32px;
       }
 
       p {
-        line-height: 2;
+        font-size: 16px;
+        line-height: 22px;
+        margin: 0;
+        padding-bottom: 32px;
       }
 
       a {
         text-decoration: none;
-        color: #4a90e2;
+        color: #6a67fe;
       }
 
       a:hover {
-        text-decoration: underline;
+        text-decoration: none;
       }
 
       @media only screen and (max-device-width: 480px) {
@@ -43,7 +50,7 @@
       }
     </style>
   </head>
-  <body>
+  <body style="color: #192147">
     <table
       align="center"
       border="0"
@@ -55,7 +62,6 @@
       style="
         background: #f9fafc;
         font-family: 'Nunito Sans', sans-serif;
-        color: #66696f;
         border-collapse: collapse;
       "
     >
@@ -67,74 +73,104 @@
             cellpadding="0"
             cellspacing="0"
             bgcolor="#ffffff"
-            style="margin: 20px 10px"
+            style="
+              margin: 20px 20px;
+              border: 1px solid #e2e4ea;
+              border-radius: 8px;
+            "
           >
             <tr>
               <td
                 colspan="2"
                 bgcolor="#ffffff"
-                style="padding: 20px; font-family: 'Nunito Sans', sans-serif"
+                style="
+                  padding-top: 40px;
+                  padding-left: 48px;
+                  font-family: 'Nunito Sans', sans-serif;
+                  border-radius: 8px 8px 0px 0px;
+                "
               >
-                <img
-                  src="{{.AssetURL}}/assets/images/fleet-logo-color@2x.png?raw=true"
-                  width="174"
-                  height="48"
-                />
+                <a href="https://fleetdm.com" target="_blank">
+                  <img
+                    alt="Fleet logo"
+                    src="{{.AssetURL}}/assets/images/fleet-logo-blue-118x41@2x.png?raw=true"
+                    style="height: 41px; width: 118px"
+                  />
+                </a>
               </td>
             </tr>
             <tr>
               <td
                 colspan="2"
-                style="padding: 60px; font-family: 'Nunito Sans', sans-serif"
+                style="
+                  padding-top: 48px;
+                  padding-bottom: 48px;
+                  padding-left: 48px;
+                  padding-right: 48px;
+                  font-family: 'Nunito Sans', sans-serif;
+                "
               >
-                <h1 style="font-weight: 300">Reset Your Fleet Password...</h1>
+                <h1>Reset your Fleet password</h1>
                 <p>
                   Someone requested a password reset on your Fleet account.
-                  Follow the link below to reset your password:
+                  Please click 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/main/docs"
-                  style="color: #fff; text-decoration: none"
-                  >Fleet Documentation</a
+                  href="{{.BaseURL}}/login/reset?token={{.Token}}"
+                  target="_blank"
+                  style="
+                    font-weight: 700;
+                    color: #fff;
+                    text-decoration: none;
+                    border-radius: 4px;
+                    -webkit-border-radius: 4px;
+                    background-color: #6a67fe;
+                    border-top: 8px solid #6a67fe;
+                    border-bottom: 8px solid #6a67fe;
+                    border-right: 16px solid #6a67fe;
+                    border-left: 16px solid #6a67fe;
+                    display: inline-block;
+                  "
                 >
-              </td>
-              <td
-                valign="middle"
-                align="right"
-                style="
-                  padding: 10px 20px;
-                  font-family: 'Nunito Sans', sans-serif;
-                "
-              >
-                <a href="https://fleetdm.com" style="text-decoration: none"
-                  ><img
-                    src="{{.AssetURL}}/assets/images/fleet-logo-text-all-white@2x.png?raw=true"
-                    width="122"
-                    height="33"
-                /></a>
+                  Reset password
+                </a>
+                <p style="font-style: italic; padding-top: 32px; padding-bottom: 0;">
+                  If you did not make the request, you may ignore this email as no changes have been made.
+                </p>
+                <div
+                  style="border-bottom: 1px solid #e2e4ea; padding-top: 32px"
+                ></div>
+                <div style="padding-top: 32px; padding-bottom: 32px">
+                  <a href="https://github.com/fleetdm/fleet" target="_blank">
+                    <img
+                      alt="Fleet logo"
+                      style="height: 20px; width: 20px; padding-right: 20px"
+                      src="{{.AssetURL}}/assets/images/fleet-mark-color-40x40@2x.png?raw=true"
+                    />
+                  </a>
+                  <a href="https://twitter.com/fleetctl" target="_blank">
+                    <img
+                      alt="Twitter logo"
+                      style="height: 20px; width: 25px; padding-right: 20px"
+                      src="{{.AssetURL}}/assets/images/twitter-logo-50x40@2x.png?raw=true"
+                    />
+                  </a>
+                  <a
+                    href="https://osquery.slack.com/join/shared_invite/zt-h29zm0gk-s2DBtGUTW4CFel0f0IjTEw#/"
+                    target="_blank"
+                  >
+                    <img
+                      alt="Slack logo"
+                      style="height: 20px; width: 20.5px; padding-right: 20px"
+                      src="{{.AssetURL}}/assets/images/slack-logo-41x40@2x.png?raw=true"
+                    />
+                  </a>
+                </div>
+                <p style="font-size: 12px; line-height: 16px; padding: 0">
+                  © 2021 Fleet Device Management Inc. <br />
+                  All trademarks, service marks, and company names are the
+                  property of their respective owners.
+                </p>
               </td>
             </tr>
           </table>
diff --git a/server/mail/templates/smtp_setup.html b/server/mail/templates/smtp_setup.html
index d8beec96a1..3832c7439a 100644
--- a/server/mail/templates/smtp_setup.html
+++ b/server/mail/templates/smtp_setup.html
@@ -9,24 +9,31 @@
     <style>
       body {
         font-family: "Nunito Sans", sans-serif;
+        margin: 0;
       }
 
       h1 {
-        font-weight: normal;
-        margin: 20px 0 40px 0;
+        font-weight: 700;
+        font-size: 24px;
+        line-height: 32px;
+        margin: 0;
+        padding-bottom: 32px;
       }
 
       p {
-        line-height: 2;
+        font-size: 16px;
+        line-height: 22px;
+        margin: 0;
+        padding-bottom: 32px;
       }
 
       a {
         text-decoration: none;
-        color: #4a90e2;
+        color: #6A67FE;
       }
 
       a:hover {
-        text-decoration: underline;
+        text-decoration: none;
       }
 
       @media only screen and (max-device-width: 480px) {
@@ -43,7 +50,7 @@
       }
     </style>
   </head>
-  <body>
+  <body style="color: #192147">
     <table
       align="center"
       border="0"
@@ -55,7 +62,6 @@
       style="
         background: #f9fafc;
         font-family: 'Nunito Sans', sans-serif;
-        color: #66696f;
         border-collapse: collapse;
       "
     >
@@ -67,65 +73,80 @@
             cellpadding="0"
             cellspacing="0"
             bgcolor="#ffffff"
-            style="margin: 20px 10px"
+            style="margin: 20px 20px; border: 1px solid #E2E4EA; border-radius: 8px;"
           >
             <tr>
               <td
                 colspan="2"
                 bgcolor="#ffffff"
-                style="padding: 20px; font-family: 'Nunito Sans', sans-serif"
+                style="
+                  padding-top: 40px;
+                  padding-left: 48px;
+                  font-family: 'Nunito Sans', sans-serif;
+                  border-radius: 8px 8px 0px 0px
+                "
               >
+              <a href="https://fleetdm.com" target="_blank">
                 <img
-                  src="{{.AssetURL}}/assets/images/fleet-logo-color@2x.png?raw=true"
-                  width="174"
-                  height="48"
+                  alt="Fleet logo"
+                  src="{{.AssetURL}}/assets/images/fleet-logo-blue-118x41@2x.png?raw=true"
+                  style="height: 41px; width: 118px"
                 />
-              </td>
+              </a>
+            </td>
             </tr>
             <tr>
               <td
                 colspan="2"
-                style="padding: 60px; font-family: 'Nunito Sans', sans-serif"
+                style="
+                  padding-top: 48px;
+                  padding-bottom: 48px;
+                  padding-left: 48px;
+                  padding-right: 48px;
+                  font-family: 'Nunito Sans', sans-serif;
+                "
               >
-                <h1 style="font-weight: 300">Confirmed Fleet SMTP Setup</h1>
-                <p>
-                  This message confirms that SMTP is set up properly on your
-                  <a href="{{.BaseURL}}">Fleet instance</a>.
+                <h1>Fleet SMTP setup confirmed</h1>
+                <p>This message confirms that SMTP is set up properly <a href="{{.BaseURL}}">on your Fleet instance</a>.</p>
+                <div
+                  style="
+                    border-top: 1px solid #e2e4ea;
+                    padding-top: 32px;
+                  "
+                ></div>
+                <div style="padding-top: 32px; padding-bottom: 32px">
+                  <a href="https://github.com/fleetdm/fleet" target="_blank">
+                    <img
+                      alt="Fleet logo"
+                      style="height: 20px; width: 20px; padding-right: 20px"
+                      src="{{.AssetURL}}/assets/images/fleet-mark-color-40x40@2x.png?raw=true"
+                    />
+                  </a>
+                  <a href="https://twitter.com/fleetctl" target="_blank">
+                    <img
+                      alt="Twitter logo"
+                      style="height: 20px; width: 25px; padding-right: 20px"
+                      src="{{.AssetURL}}/assets/images/twitter-logo-50x40@2x.png?raw=true"
+                    />
+                  </a>
+                  <a
+                    href="https://osquery.slack.com/join/shared_invite/zt-h29zm0gk-s2DBtGUTW4CFel0f0IjTEw#/"
+                    target="_blank"
+                  >
+                    <img
+                      alt="Slack logo"
+                      style="height: 20px; width: 20.5px; padding-right: 20px"
+                      src="{{.AssetURL}}/assets/images/slack-logo-41x40@2x.png?raw=true"
+                    />
+                  </a>
+                </div>
+                <p style="font-size: 12px; line-height: 16px; padding: 0;">
+                  © 2021 Fleet Device Management Inc. <br />
+                  All trademarks, service marks, and company names are the
+                  property of their respective owners.
                 </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/main/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://fleetdm.com" style="text-decoration: none"
-                  ><img
-                    src="{{.AssetURL}}/assets/images/fleet-logo-text-all-white@2x.png?raw=true"
-                    width="122"
-                    height="33"
-                /></a>
-              </td>
-            </tr>
           </table>
           <br />
         </td>