fix(email): Update notification email styles - increase font-size and re-size columns for User Bills, center header text. Also fixes the test email script to accomodate the new pluralize helper

Author: Mephistic

functions/src/email/partials/header.handlebars

@@ -3,7 +3,7 @@
 </div>
 
 <header style="background-color: #FFFFFF; padding: 24px 0px 12px;
-  gap: 16px">
+  gap: 16px; text-align: center;">
   <div>
     <h2 style="font-weight: 700; font-size: 31px; line-height: 125%; margin: auto; width: 70%; color: #1a3185">
       Here is your

functions/src/email/partials/users/user.handlebars

@@ -24,7 +24,7 @@
         {{/ifGreaterThan}}
       </div>
     </div>
-    <table style="display: inline-block; margin: 0; padding: 0">
+    <table style="display: inline-block; margin: 0; padding: 0; font-size: 20px;">
       <tr>
         {{!-- the possibility of the 6th item being handled differently and
           the possibility of more than 6 data points makes iterating 
@@ -33,14 +33,14 @@
         {{!-- Item 1 --}}
 
         {{#if this.bills.0.billId}}
-          <td style="width: 75px">
+          <td style="width: 100px">
             <div style="text-decoration-line: underline; display: inline-block; margin-right: 15px">
               <a href="https://mapletestimony.org/bills/{{this.bills.0.court}}/{{this.bills.0.billId}}" target="_blank" rel="noopener noreferrer" style="color: inherit">
                 {{this.bills.0.billId}}
               </a>
             </div>
           </td>
-          <td style="width: 75px">
+          <td style="width: 50px">
             <img
               src="https://mapletestimony.org/email/images_no-svgs/{{this.bills.0.position}}.jpg"
             />
@@ -50,14 +50,14 @@
         {{!-- Item 2 --}}
 
         {{#if this.bills.1.billId}}
-          <td style="width: 75px">
+          <td style="width: 100px">
             <div style="text-decoration-line: underline; display: inline-block; margin-right: 15px">
               <a href="https://mapletestimony.org/bills/{{this.bills.1.court}}/{{this.bills.1.billId}}" target="_blank" rel="noopener noreferrer" style="color: inherit">
                 {{this.bills.1.billId}}
               </a>
             </div>
           </td>
-          <td style="width: 75px">
+          <td style="width: 50px">
             <img
               src="https://mapletestimony.org/email/images_no-svgs/{{this.bills.1.position}}.jpg"
             />
@@ -68,14 +68,14 @@
         {{!-- Item 3 --}}
 
         {{#if this.bills.2.billId}}
-          <td style="width: 75px">
+          <td style="width: 100px">
             <div style="text-decoration-line: underline; display: inline-block; margin-right: 15px">
               <a href="https://mapletestimony.org/bills/{{this.bills.2.court}}/{{this.bills.2.billId}}" target="_blank" rel="noopener noreferrer" style="color: inherit">
                 {{this.bills.2.billId}}
               </a>
             </div>
           </td>
-          <td style="width: 75px">
+          <td style="width: 50px">
             <img
               src="https://mapletestimony.org/email/images_no-svgs/{{this.bills.2.position}}.jpg"
             />
@@ -85,14 +85,14 @@
         {{!-- Item 4 --}}
 
         {{#if this.bills.3.billId}}
-          <td style="width: 75px">
+          <td style="width: 100px">
             <div style="text-decoration-line: underline; display: inline-block; margin-right: 15px">
               <a href="https://mapletestimony.org/bills/{{this.bills.3.court}}/{{this.bills.3.billId}}" target="_blank" rel="noopener noreferrer" style="color: inherit">
                 {{this.bills.3.billId}}
               </a>
             </div>
           </td>
-          <td style="width: 75px">
+          <td style="width: 50px">
             <img
               src="https://mapletestimony.org/email/images_no-svgs/{{this.bills.3.position}}.jpg"
             />
@@ -104,14 +104,14 @@
         {{!-- Item 5 --}}
 
         {{#if this.bills.4.billId}}
-          <td style="width: 75px">
+          <td style="width: 100px">
             <div style="text-decoration-line: underline; display: inline-block; margin-right: 15px">
               <a href="https://mapletestimony.org/bills/{{this.bills.4.court}}/{{this.bills.4.billId}}" target="_blank" rel="noopener noreferrer" style="color: inherit">
                 {{this.bills.4.billId}}
               </a>
             </div>
           </td>
-          <td style="width: 75px">
+          <td style="width: 50px">
             <img
               src="https://mapletestimony.org/email/images_no-svgs/{{this.bills.4.position}}.jpg"
             />
@@ -122,25 +122,25 @@
 
         {{#if this.bills.5.billId}}
           {{#if this.bills.6.billId}}
-            <td style="width: 75px">
+            <td style="width: 100px">
               <a class="orgItemText" href="https://mapletestimony.org/profile?id={{userId}}" target="_blank" rel="noopener noreferrer">
                 see more
               </a>
             </td>
-            <td style="width: 75px">
+            <td style="width: 50px">
               <div style="color: #1A3185; font-weight: bold;">
                 +
               </div>
             </td>
           {{else}}
-            <td style="width: 75px">
+            <td style="width: 100px">
               <div style="text-decoration-line: underline; display: inline-block; margin-right: 15px">
                 <a href="https://mapletestimony.org/bills/{{this.bills.5.court}}/{{this.bills.5.billId}}" target="_blank" rel="noopener noreferrer" style="color: inherit">
                   {{this.bills.5.billId}}
                 </a>
               </div>
             </td>
-            <td style="width: 75px">
+            <td style="width: 50px">
               <img
                 src="https://mapletestimony.org/email/images_no-svgs/{{this.bills.5.position}}.jpg"
               />

scripts/firebase-admin/sendTestEmail.ts

@@ -26,6 +26,8 @@ handlebars.registerHelper("formatDate", helpers.formatDate)
 handlebars.registerHelper("minusFour", helpers.minusFour)
 handlebars.registerHelper("noUpdatesFormat", helpers.noUpdatesFormat)
 handlebars.registerHelper("toLowerCase", helpers.toLowerCase)
+handlebars.registerHelper("pluralize", helpers.pluralize)
+
 function registerPartials(directoryPath: string) {
   console.log("REGISTERING PARTIALS")