From 12d2a1ba6396a02b249d9145f93046584a279200 Mon Sep 17 00:00:00 2001
From: Nicolae Socaciu <103567375+nicolaesocaciu@users.noreply.github.com>
Date: Tue, 13 Feb 2024 03:16:25 +0200
Subject: [PATCH] fix-css-update-for-CR-email-template (#6186)

Fix: removing a css line that was blocking some style
Improvement: clean up some unnecessary comments

Before the fix:

![image](https://github.com/Unleash/unleash/assets/103567375/7a94c20d-ea7c-40cd-b207-128ab5674e97)


after:

![image](https://github.com/Unleash/unleash/assets/103567375/11ebb46e-c724-4b38-91f6-f2f3e4aff9e6)
---
 .../scheduled-change-conflict.html.mustache   | 148 ++++++++---------
 .../scheduled-execution-failed.html.mustache  | 149 ++++++++----------
 2 files changed, 126 insertions(+), 171 deletions(-)

diff --git a/src/mailtemplates/scheduled-change-conflict/scheduled-change-conflict.html.mustache b/src/mailtemplates/scheduled-change-conflict/scheduled-change-conflict.html.mustache
index 76117654b6..49bb71529d 100644
--- a/src/mailtemplates/scheduled-change-conflict/scheduled-change-conflict.html.mustache
+++ b/src/mailtemplates/scheduled-change-conflict/scheduled-change-conflict.html.mustache
@@ -31,17 +31,9 @@
         * @theme page
         */
         body, #bodyTable{
-            /*@editable*/ background:#F7F7FA;
+            background:#F7F7FA;
         }
 
-        /**
-        * @tab Page
-        * @section background style
-        * @tip Set the background color and top border for your email. You may want to choose colors that match your company's branding.
-        * @theme page
-        */
-        #bodyCell{
-        }
 
         /**
         * @tab Page
@@ -49,7 +41,7 @@
         * @tip Set the border for your email.
         */
         #templateContainer{
-            /*@editable*/ border:2px solid #817AFE;
+            border:2px solid #817AFE;
             border-radius: 12px;
             overflow: hidden;
             padding: 48px;
@@ -62,14 +54,14 @@
         * @style heading 1
         */
         h1{
-            /*@editable*/ color:#202021 !important;
+            color:#202021 !important;
             display:block;
-            /*@editable*/ font-family:Helvetica;
-            /*@editable*/ font-size:24px;
-            /*@editable*/ font-style:normal;
-            /*@editable*/ font-weight:bold;
-            /*@editable*/ line-height:1.4;
-            /*@editable*/ letter-spacing:normal;
+            font-family:Helvetica;
+            font-size:24px;
+            font-style:normal;
+            font-weight:bold;
+            line-height:1.4;
+            letter-spacing:normal;
             margin-top:0;
             margin-right:0;
             margin-bottom:32px;
@@ -83,19 +75,19 @@
         * @style heading 2
         */
         h2{
-            /*@editable*/ color:#202021 !important;
+            color:#202021 !important;
             display:block;
-            /*@editable*/ font-family:Helvetica;
-            /*@editable*/ font-size:20px;
-            /*@editable*/ font-style:normal;
-            /*@editable*/ font-weight:bold;
-            /*@editable*/ line-height:1.4;
-            /*@editable*/ letter-spacing:normal;
+            font-family:Helvetica;
+            font-size:20px;
+            font-style:normal;
+            font-weight:bold;
+            line-height:1.4;
+            letter-spacing:normal;
             margin-top:0;
             margin-right:0;
             margin-bottom:24px;
             margin-left:0;
-            /*@editable*/ text-align:left;
+            text-align:left;
         }
 
         /**
@@ -105,19 +97,19 @@
         * @style heading 3
         */
         h3{
-            /*@editable*/ color:#202021 !important;
+            color:#202021 !important;
             display:block;
-            /*@editable*/ font-family:Helvetica;
-            /*@editable*/ font-size:16px;
-            /*@editable*/ font-style:normal;
-            /*@editable*/ font-weight:bold;
-            /*@editable*/ line-height:1.4;
-            /*@editable*/ letter-spacing:normal;
+            font-family:Helvetica;
+            font-size:16px;
+            font-style:normal;
+            font-weight:bold;
+            line-height:1.4;
+            letter-spacing:normal;
             margin-top:0;
             margin-right:0;
             margin-bottom:16px;
             margin-left:0;
-            /*@editable*/ text-align:left;
+            text-align:left;
         }
 
         /**
@@ -127,19 +119,19 @@
         * @style heading 4
         */
         h4{
-            /*@editable*/ color:#202021 !important;
+            color:#202021 !important;
             display:block;
-            /*@editable*/ font-family:Helvetica;
-            /*@editable*/ font-size:14px;
-            /*@editable*/ font-style:normal;
-            /*@editable*/ font-weight:normal;
-            /*@editable*/ line-height:1.4;
-            /*@editable*/ letter-spacing:normal;
+            font-family:Helvetica;
+            font-size:14px;
+            font-style:normal;
+            font-weight:normal;
+            line-height:1.4;
+            letter-spacing:normal;
             margin-top:0;
             margin-right:0;
             margin-bottom:16px;
             margin-left:0;
-            /*@editable*/ text-align:left;
+            text-align:left;
         }
 
         /* ========== Header Styles ========== */
@@ -151,7 +143,7 @@
         * @theme header
         */
         #templateHeader{
-            /*@editable*/ color:#6E6E70;
+            color:#6E6E70;
         }
 
         /**
@@ -160,17 +152,17 @@
         * @tip Set the styling for your email's header text. Choose a size and color that is easy to read.
         */
         .headerContent{
-            /*@editable*/ color:#6E6E70;
-            /*@editable*/ font-family:Helvetica;
-            /*@editable*/ font-size:20px;
-            /*@editable*/ font-weight:bold;
-            /*@editable*/ line-height:1.4;
-            /*@editable*/ padding-top:0;
-            /*@editable*/ padding-right:0;
-            /*@editable*/ padding-bottom:0;
-            /*@editable*/ padding-left:0;
-            /*@editable*/ text-align:left;
-            /*@editable*/ vertical-align:middle;
+            color:#6E6E70;
+            font-family:Helvetica;
+            font-size:20px;
+            font-weight:bold;
+            line-height:1.4;
+            padding-top:0;
+            padding-right:0;
+            padding-bottom:0;
+            padding-left:0;
+            text-align:left;
+            vertical-align:middle;
         }
 
         /**
@@ -179,13 +171,11 @@
         * @tip Set the styling for your email's header links. Choose a color that helps them stand out from your text.
         */
         .headerContent a:link, .headerContent a:visited, /* Yahoo! Mail Override */ .headerContent a .yshortcuts /* Yahoo! Mail Override */{
-            /*@editable*/ color:#fff;
-            /*@editable*/ font-weight:normal;
-            /*@editable*/ text-decoration:underline;
+            color:#fff;
+            font-weight:normal;
+            text-decoration:underline;
         }
 
-        #headerImage{
-        }
 
         /* ========== Body Styles ========== */
 
@@ -208,11 +198,11 @@
         * @theme main
         */
         .bodyContent{
-            /*@editable*/ color:#202021;
-            /*@editable*/ font-family:Helvetica;
-            /*@editable*/ font-size:16px;
-            /*@editable*/ line-height:1.4;
-            /*@editable*/ text-align:left;
+            color:#202021;
+            font-family:Helvetica;
+            font-size:16px;
+            line-height:1.4;
+            text-align:left;
         }
 
         .bodyContent img{
@@ -244,15 +234,6 @@
 
         /* ========== Footer Styles ========== */
 
-        /**
-        * @tab Footer
-        * @section footer style
-        * @tip Set the background color and borders for your email's footer area.
-        * @theme footer
-        */
-        #templateFooter{
-        }
-
         /**
         * @tab Footer
         * @section footer text
@@ -260,11 +241,11 @@
         * @theme footer
         */
         .footerContent{
-            /*@editable*/ color:#6E6E70;
-            /*@editable*/ font-family:Helvetica;
-            /*@editable*/ font-size:14px;
-            /*@editable*/ line-height:1.4;
-            /*@editable*/ text-align:left;
+            color:#6E6E70;
+            font-family:Helvetica;
+            font-size:14px;
+            line-height:1.4;
+            text-align:left;
         }
 
         .footerContent a {
@@ -286,9 +267,9 @@
         * @tip Set the styling for your email's footer links. Choose a color that helps them stand out from your text.
         */
         .footerContent a:link, .footerContent a:visited, /* Yahoo! Mail Override */ .footerContent a .yshortcuts, .footerContent a span /* Yahoo! Mail Override */{
-            /*@editable*/ color:#615BC2;
-            /*@editable*/ font-weight:normal;
-            /*@editable*/ text-decoration:underline;
+            color:#615BC2;
+            font-weight:normal;
+            text-decoration:underline;
         }
 
         /* /\/\/\/\/\/\/\/\/ MOBILE STYLES /\/\/\/\/\/\/\/\/ */
@@ -312,13 +293,10 @@
             */
             #templateContainer{
                 max-width:600px !important;
-                /*@editable*/ width:100% !important;
+                width:100% !important;
                 padding: 32px;
             }
-
-            /* ======== Header Styles ======== */
-
-
+            
 
             /* ======== Body Styles ======== */
 
diff --git a/src/mailtemplates/scheduled-execution-failed/scheduled-execution-failed.html.mustache b/src/mailtemplates/scheduled-execution-failed/scheduled-execution-failed.html.mustache
index 706aa6c627..7a260f1a41 100644
--- a/src/mailtemplates/scheduled-execution-failed/scheduled-execution-failed.html.mustache
+++ b/src/mailtemplates/scheduled-execution-failed/scheduled-execution-failed.html.mustache
@@ -15,7 +15,6 @@
         /* /\/\/\/\/\/\/\/\/ RESET STYLES /\/\/\/\/\/\/\/\/ */
         body{margin:0; padding:0;}
         img{border:0; height:auto; line-height:100%; outline:none; text-decoration:none;}
-        table{border-collapse:collapse !important;}
         body, #bodyTable, #bodyCell{height:100% !important; margin:0; padding:0; width:100% !important;}
 
         /* /\/\/\/\/\/\/\/\/ TEMPLATE STYLES /\/\/\/\/\/\/\/\/ */
@@ -32,17 +31,9 @@
         * @theme page
         */
         body, #bodyTable{
-            /*@editable*/ background-color:#F7F7FA;
+            background-color:#F7F7FA;
         }
 
-        /**
-        * @tab Page
-        * @section background style
-        * @tip Set the background color and top border for your email. You may want to choose colors that match your company's branding.
-        * @theme page
-        */
-        #bodyCell{
-        }
 
         /**
         * @tab Page
@@ -50,7 +41,7 @@
         * @tip Set the border for your email.
         */
         #templateContainer{
-         /*@editable*/ border:2px solid #817AFE;
+            border:2px solid #817AFE;
             border-radius: 12px;
             overflow: hidden;
             padding: 48px;        
@@ -63,14 +54,14 @@
         * @style heading 1
         */
         h1{
-            /*@editable*/ color:#202021 !important;
+            color:#202021 !important;
             display:block;
-            /*@editable*/ font-family:Helvetica;
-            /*@editable*/ font-size:24px;
-            /*@editable*/ font-style:normal;
-            /*@editable*/ font-weight:bold;
-            /*@editable*/ line-height:1.4;
-            /*@editable*/ letter-spacing:normal;
+            font-family:Helvetica;
+            font-size:24px;
+            font-style:normal;
+            font-weight:bold;
+            line-height:1.4;
+            letter-spacing:normal;
             margin-top:0;
             margin-right:0;
             margin-bottom:32px;
@@ -84,19 +75,19 @@
         * @style heading 2
         */
         h2{
-            /*@editable*/ color:#202021 !important;
+            color:#202021 !important;
             display:block;
-            /*@editable*/ font-family:Helvetica;
-            /*@editable*/ font-size:20px;
-            /*@editable*/ font-style:normal;
-            /*@editable*/ font-weight:bold;
-            /*@editable*/ line-height:1.4;
-            /*@editable*/ letter-spacing:normal;
+            font-family:Helvetica;
+            font-size:20px;
+            font-style:normal;
+            font-weight:bold;
+            line-height:1.4;
+            letter-spacing:normal;
             margin-top:0;
             margin-right:0;
             margin-bottom:24px;
             margin-left:0;
-            /*@editable*/ text-align:left;
+            text-align:left;
         }
 
         /**
@@ -106,19 +97,19 @@
         * @style heading 3
         */
         h3{
-            /*@editable*/ color:#202021 !important;
+            color:#202021 !important;
             display:block;
-            /*@editable*/ font-family:Helvetica;
-            /*@editable*/ font-size:16px;
-            /*@editable*/ font-style:normal;
-            /*@editable*/ font-weight:bold;
-            /*@editable*/ line-height:1.4;
-            /*@editable*/ letter-spacing:normal;
+            font-family:Helvetica;
+            font-size:16px;
+            font-style:normal;
+            font-weight:bold;
+            line-height:1.4;
+            letter-spacing:normal;
             margin-top:0;
             margin-right:0;
             margin-bottom:16px;
             margin-left:0;
-            /*@editable*/ text-align:left;
+            text-align:left;
         }
 
         /**
@@ -128,19 +119,19 @@
         * @style heading 4
         */
         h4{
-           /*@editable*/ color:#202021 !important;
+            color:#202021 !important;
             display:block;
-            /*@editable*/ font-family:Helvetica;
-            /*@editable*/ font-size:14px;
-            /*@editable*/ font-style:normal;
-            /*@editable*/ font-weight:normal;
-            /*@editable*/ line-height:1.4;
-            /*@editable*/ letter-spacing:normal;
+            font-family:Helvetica;
+            font-size:14px;
+            font-style:normal;
+            font-weight:normal;
+            line-height:1.4;
+            letter-spacing:normal;
             margin-top:0;
             margin-right:0;
             margin-bottom:16px;
             margin-left:0;
-            /*@editable*/ text-align:left;
+            text-align:left;
         }
 
         /* ========== Header Styles ========== */
@@ -152,7 +143,7 @@
         * @theme header
         */
         #templateHeader{
-            /*@editable*/ color:#6E6E70;
+            color:#6E6E70;
         }
 
         /**
@@ -161,17 +152,17 @@
         * @tip Set the styling for your email's header text. Choose a size and color that is easy to read.
         */
         .headerContent{
-            /*@editable*/ color:#6E6E70;
-            /*@editable*/ font-family:Helvetica;
-            /*@editable*/ font-size:20px;
-            /*@editable*/ font-weight:bold;
-            /*@editable*/ line-height:1.4;
-            /*@editable*/ padding-top:0;
-            /*@editable*/ padding-right:0;
-            /*@editable*/ padding-bottom:0;
-            /*@editable*/ padding-left:0;
-            /*@editable*/ text-align:left;
-            /*@editable*/ vertical-align:middle;
+            color:#6E6E70;
+            font-family:Helvetica;
+            font-size:20px;
+            font-weight:bold;
+            line-height:1.4;
+            padding-top:0;
+            padding-right:0;
+            padding-bottom:0;
+            padding-left:0;
+            text-align:left;
+            vertical-align:middle;
         }
 
         /**
@@ -180,13 +171,11 @@
         * @tip Set the styling for your email's header links. Choose a color that helps them stand out from your text.
         */
         .headerContent a:link, .headerContent a:visited, /* Yahoo! Mail Override */ .headerContent a .yshortcuts /* Yahoo! Mail Override */{
-            /*@editable*/ color:#fff;
-            /*@editable*/ font-weight:normal;
-            /*@editable*/ text-decoration:underline;
+            color:#fff;
+            font-weight:normal;
+            text-decoration:underline;
         }
 
-        #headerImage{
-        }
 
         /* ========== Body Styles ========== */
 
@@ -209,11 +198,11 @@
         * @theme main
         */
         .bodyContent{
-            /*@editable*/ color:#202021;
-            /*@editable*/ font-family:Helvetica;
-            /*@editable*/ font-size:16px;
-            /*@editable*/ line-height:1.4;
-            /*@editable*/ text-align:left;
+            color:#202021;
+            font-family:Helvetica;
+            font-size:16px;
+            line-height:1.4;
+            text-align:left;
         }
 
         .bodyContent img{
@@ -245,15 +234,6 @@
 
         /* ========== Footer Styles ========== */
 
-        /**
-        * @tab Footer
-        * @section footer style
-        * @tip Set the background color and borders for your email's footer area.
-        * @theme footer
-        */
-        #templateFooter{
-        }
-
         /**
         * @tab Footer
         * @section footer text
@@ -261,11 +241,11 @@
         * @theme footer
         */
         .footerContent{
-            /*@editable*/ color:#6E6E70;
-            /*@editable*/ font-family:Helvetica;
-            /*@editable*/ font-size:14px;
-            /*@editable*/ line-height:1.4;
-            /*@editable*/ text-align:left;
+            color:#6E6E70;
+            font-family:Helvetica;
+            font-size:14px;
+            line-height:1.4;
+            text-align:left;
         }
 
         .footerContent a {
@@ -286,9 +266,9 @@
         * @tip Set the styling for your email's footer links. Choose a color that helps them stand out from your text.
         */
         .footerContent a:link, .footerContent a:visited, /* Yahoo! Mail Override */ .footerContent a .yshortcuts, .footerContent a span /* Yahoo! Mail Override */{
-            /*@editable*/ color:#615BC2;
-            /*@editable*/ font-weight:normal;
-            /*@editable*/ text-decoration:underline;
+            color:#615BC2;
+            font-weight:normal;
+            text-decoration:underline;
         }
 
         /* /\/\/\/\/\/\/\/\/ MOBILE STYLES /\/\/\/\/\/\/\/\/ */
@@ -312,13 +292,10 @@
             */
             #templateContainer{
                 max-width:600px !important;
-                /*@editable*/ width:100% !important;
+                width:100% !important;
                 padding: 32px;
             }
 
-            /* ======== Header Styles ======== */
-
-
 
             /* ======== Body Styles ======== */
 
@@ -329,7 +306,7 @@
 
             /* ======== Footer Styles ======== */
 
-            .footerContent a{
+            .footerContent a {
                 display:block !important;
                 border-right: 0;
                 padding: 6px 0;