stages/email: minify email css template

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>

authentik/stages/email/static/stages/email/css/base.css

@@ -1,81 +1,56 @@
-/* -------------------------------------
+/* authentik Email CSS */
-    GLOBAL
-    A very basic CSS reset
-------------------------------------- */
 * {
   margin: 0;
   font-family: Helvetica, Arial, sans-serif;
   box-sizing: border-box;
   font-size: 14px;
 }
-
 img {
   max-width: 100%;
 }
-
 body {
   -webkit-font-smoothing: antialiased;
   -webkit-text-size-adjust: none;
   width: 100% !important;
   height: 100%;
   line-height: 1.6em;
-  /* 1.6em * 14px = 22.4px, use px to get airier line-height also in Thunderbird, and Yahoo!, Outlook.com, AOL webmail clients */
-  /*line-height: 22px;*/
 }
-
-/* Let's make sure all tables have defaults */
 table td {
   vertical-align: top;
 }
-
-/* -------------------------------------
-    BODY & CONTAINER
-------------------------------------- */
 body {
   background-color: #f6f6f6;
 }
-
 .body-wrap {
   background-color: #f6f6f6;
   width: 100%;
 }
-
 .container {
   display: block !important;
   max-width: 600px !important;
   margin: 0 auto !important;
-  /* makes it centered */
   clear: both !important;
 }
-
 .content {
   max-width: 600px;
   margin: 0 auto;
   display: block;
   padding: 20px;
 }
-
-/* -------------------------------------
-    HEADER, FOOTER, MAIN
-------------------------------------- */
 .main {
   background-color: #fff;
   border: 1px solid #e9e9e9;
 }
-
 .content-wrap {
   padding: 20px;
 }
-
 .content-block {
   padding: 0 0 20px;
 }
-
 .header {
   width: 100%;
   margin-bottom: 20px;
 }
-
 .footer {
   width: 100%;
   clear: both;
@@ -86,10 +61,6 @@ body {
   color: #999;
   font-size: 12px;
 }
-
-/* -------------------------------------
-    TYPOGRAPHY
-------------------------------------- */
 h1, h2, h3 {
   font-family: Helvetica, Arial, sans-serif;
   color: #000;
@@ -97,31 +68,20 @@ h1, h2, h3 {
   line-height: 1.2em;
   font-weight: 400;
 }
-
 h1 {
   font-size: 32px;
   font-weight: 500;
-  /* 1.2em * 32px = 38.4px, use px to get airier line-height also in Thunderbird, and Yahoo!, Outlook.com, AOL webmail clients */
-  /*line-height: 38px;*/
 }
-
 h2 {
   font-size: 24px;
-  /* 1.2em * 24px = 28.8px, use px to get airier line-height also in Thunderbird, and Yahoo!, Outlook.com, AOL webmail clients */
-  /*line-height: 29px;*/
 }
-
 h3 {
   font-size: 18px;
-  /* 1.2em * 18px = 21.6px, use px to get airier line-height also in Thunderbird, and Yahoo!, Outlook.com, AOL webmail clients */
-  /*line-height: 22px;*/
 }
-
 h4 {
   font-size: 14px;
   font-weight: 600;
 }
-
 p, ul, ol {
   margin-bottom: 10px;
   font-weight: normal;
@@ -130,15 +90,10 @@ p li, ul li, ol li {
   margin-left: 5px;
   list-style-position: inside;
 }
-
-/* -------------------------------------
-    LINKS & BUTTONS
-------------------------------------- */
 a {
   color: #348eda;
   text-decoration: underline;
 }
-
 .btn-primary {
   text-decoration: none;
   color: #FFF;
@@ -146,50 +101,33 @@ a {
   border: solid #348eda;
   border-width: 10px 20px;
   line-height: 2em;
-  /* 2em * 14px = 28px, use px to get airier line-height also in Thunderbird, and Yahoo!, Outlook.com, AOL webmail clients */
-  /*line-height: 28px;*/
   font-weight: bold;
   text-align: center;
   cursor: pointer;
   display: inline-block;
   text-transform: capitalize;
 }
-
 .btn-primary a {
   color: #fff;
 }
-
-/* -------------------------------------
-    OTHER STYLES THAT MIGHT BE USEFUL
-------------------------------------- */
 .last {
   margin-bottom: 0;
 }
-
 .first {
   margin-top: 0;
 }
-
+.align-center {
-.aligncenter {
   text-align: center;
 }
-
+.align-right {
-.alignright {
   text-align: right;
 }
-
+.align-left {
-.alignleft {
   text-align: left;
 }
-
 .clear {
   clear: both;
 }
-
-/* -------------------------------------
-    ALERTS
-    Change the class depending on warning email, good email or bad email
-------------------------------------- */
 .alert {
   font-size: 16px;
   color: #fff;
@@ -215,72 +153,53 @@ a {
 .alert-success {
   background-color: #3E8635;
 }
-
+.body {
-/* -------------------------------------
-    INVOICE
-    Styles for the billing table
-------------------------------------- */
-.invoice {
   margin: 40px auto;
   text-align: left;
   width: 80%;
 }
-.invoice td {
+.body td {
   padding: 5px 0;
 }
-.invoice .invoice-items {
+.body .body-items {
   width: 100%;
 }
-.invoice .invoice-items td {
+.body .body-items td {
   border-top: #eee 1px solid;
 }
-.invoice .invoice-items .total td {
+.body .body-items .total td {
   border-top: 2px solid #333;
   border-bottom: 2px solid #333;
   font-weight: 700;
 }
-
-/* -------------------------------------
-    RESPONSIVE AND MOBILE FRIENDLY STYLES
-------------------------------------- */
 @media only screen and (max-width: 640px) {
   body {
     padding: 0 !important;
   }
-
   h1, h2, h3, h4 {
     font-weight: 800 !important;
     margin: 20px 0 5px !important;
   }
-
   h1 {
     font-size: 22px !important;
   }
-
   h2 {
     font-size: 18px !important;
   }
-
   h3 {
     font-size: 16px !important;
   }
-
   .container {
     padding: 0 !important;
     width: 100% !important;
   }
-
   .content {
     padding: 0 !important;
   }
-
   .content-wrap {
     padding: 10px !important;
   }
-
+  .body {
-  .invoice {
     width: 100% !important;
   }
 }
-
-/*# sourceMappingURL=styles.css.map */

authentik/stages/email/templates/email/base.html

@@ -21,7 +21,7 @@
                         <div class="footer">
                             <table width="100%">
                                 <tr>
-                                    <td class="aligncenter content-block">Powered by <a href="https://goauthentik.io?utm_source=authentik&utm_medium=email">authentik</a>.</td>
+                                    <td class="align-center content-block">Powered by <a href="https://goauthentik.io?utm_source=authentik&utm_medium=email">authentik</a>.</td>
                                 </tr>
                             </table>
                         </div>

authentik/stages/email/templates/email/generic.html

@@ -18,18 +18,18 @@
             </tr>
             {% if key_value %}
             <tr>
-                <td class="content-block aligncenter">
+                <td class="content-block align-center">
-                    <table class="invoice">
+                    <table class="body">
                         <tr>
                             <td>{% trans "Additional Information" %}</td>
                         </tr>
                         <tr>
                             <td>
-                                <table class="invoice-items" cellpadding="0" cellspacing="0">
+                                <table class="body-items" cellpadding="0" cellspacing="0">
                                     {% for key, value in key_value.items %}
                                     <tr>
                                         <td>{{ key }}</td>
-                                        <td class="alignright">{{ value }}</td>
+                                        <td class="align-right">{{ value }}</td>
                                     </tr>
                                     {% endfor %}
                                 </table>