From 4c34bc21770dc977a6230c9b9c1faa9477685ad2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20Beganovi=C4=87?= <k1pstabug@gmail.com>
Date: Mon, 18 Jan 2021 15:25:51 +0100
Subject: [PATCH] Refactor emails to plain CSS + table structure

---
 .../views/email/components/header.blade.php   | 17 +----
 resources/views/email/template/dark.blade.php | 27 +++-----
 .../views/email/template/light.blade.php      | 23 ++-----
 .../views/email/template/plain.blade.php      | 63 ++++++++++++-------
 4 files changed, 57 insertions(+), 73 deletions(-)

diff --git a/resources/views/email/components/header.blade.php b/resources/views/email/components/header.blade.php
index 75ee6c1031..b16e959e74 100644
--- a/resources/views/email/components/header.blade.php
+++ b/resources/views/email/components/header.blade.php
@@ -1,14 +1,3 @@
-<div id="header" class="border-b {{ isset($logo) ? 'p-6' : '' }} flex justify-center">
-    @isset($logo)
-        <img src="{{ $logo }}" style="height: 6rem;">
-    @endisset
-</div>
-
-<div class="flex flex-col items-center mt-8 mb-4">
-    <h1 id="title" class="text-2xl md:text-3xl mt-5">
-        {{ $slot }}
-    </h1>
-    @isset($p)
-        {!! $p !!}
-    @endisset
-</div>
\ No newline at end of file
+@isset($logo)
+    <img src="{{ $logo }}" style="height: 4rem;">
+@endisset
diff --git a/resources/views/email/template/dark.blade.php b/resources/views/email/template/dark.blade.php
index 1ffda38a15..5686fde210 100644
--- a/resources/views/email/template/dark.blade.php
+++ b/resources/views/email/template/dark.blade.php
@@ -1,22 +1,15 @@
 @component('email.template.master', ['design' => 'dark', 'settings' => $settings, 'whitelabel' => $whitelabel])
 
-@slot('header')
-    @component('email.components.header', ['p' => $body, 'logo' => (strlen($settings->company_logo) > 1) ? url('') . $settings->company_logo : 'https://www.invoiceninja.com/wp-content/uploads/2019/01/InvoiceNinja-Logo-Round-300x300.png'])
-        
-        @if(isset($title))
-        {{$title}}
+    @slot('header')
+        @include('email.components.header', ['logo' => (strlen($settings->company_logo) > 1) ? url('') . $settings->company_logo : 'https://www.invoiceninja.com/wp-content/uploads/2015/10/logo-white-horizontal-1.png'])
+    @endslot
+
+    {!! $body !!}
+
+    @slot('below_card')
+        @if($signature)
+            {{ $signature }}
         @endif
-
-    @endcomponent
-
-    @if($footer)
-        @component('email.components.button', ['url' => $view_link])
-            {{$view_text}}
-        @endcomponent
-    @endif
-
-
-@endslot
-
+    @endslot
 
 @endcomponent
diff --git a/resources/views/email/template/light.blade.php b/resources/views/email/template/light.blade.php
index 3fcfa13940..071de7226d 100644
--- a/resources/views/email/template/light.blade.php
+++ b/resources/views/email/template/light.blade.php
@@ -1,30 +1,15 @@
 @component('email.template.master', ['design' => 'light', 'settings' => $settings, 'whitelabel' => $whitelabel])
 
 @slot('header')
-    @component('email.components.header', ['p' => $body, 'logo' => (strlen($settings->company_logo) > 1) ? url('') . $settings->company_logo : 'https://www.invoiceninja.com/wp-content/uploads/2019/01/InvoiceNinja-Logo-Round-300x300.png'])
-        
-        @if(isset($title))
-            {{$title}}
-        @endif
-
-    @endcomponent
-
-
-    @if($footer)
-        @component('email.components.button', ['url' => $view_link])
-            {{$view_text}}
-        @endcomponent
-    @endif
-
-
+    @include('email.components.header', ['logo' => (strlen($settings->company_logo) > 1) ? url('') . $settings->company_logo : 'https://www.invoiceninja.com/wp-content/uploads/2015/10/logo-white-horizontal-1.png'])
 @endslot
 
-@slot('below_card')
+{!! $body !!}
 
+@slot('below_card')
     @if($signature)
         {{ $signature }}
     @endif
-
-@endslot    
+@endslot
 
 @endcomponent
diff --git a/resources/views/email/template/plain.blade.php b/resources/views/email/template/plain.blade.php
index 21ed824491..797454851d 100644
--- a/resources/views/email/template/plain.blade.php
+++ b/resources/views/email/template/plain.blade.php
@@ -1,30 +1,47 @@
-<!DOCTYPE html>
-<html lang="{{ App::getLocale() }}" class="bg-white">
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" lang="{{ str_replace('_', '-', app()->getLocale()) }}">
 
 <head>
-	<meta charset="utf-8">
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+    <title>Invoice Ninja</title>
 </head>
 
-<body class="bg-white p-4">
-	{!! $body !!}
-
-	@if($signature)
-		<div style="margin-top: 20px">
-			{!! $signature !!}
-		</div>
-	@endif
+<body>
+<table role="presentation" cellpadding="0" cellspacing="0" width="100%">
+    <tr>
+        <td style="font-family: Arial, sans-serif, 'Open Sans'">
+            <table cellpadding="0" cellspacing="0" width="100%">
+                <tr>
+                    <td>
+                        <table cellpadding="0" cellspacing="0" width="100%">
+                            <tr>
+                                <td id="email-content">
+                                    {!! $body !!}
+                                </td>
+                            </tr>
+                        </table>
+                    </td>
+                </tr>
+                <tr>
+                    @isset($whitelabel)
+                        @if(!$whitelabel)
+                            <td>
+                                <p>
+                                    <a href="https://invoiceninja.com" target="_blank">
+                                        {{ __('texts.ninja_email_footer', ['site' => 'Invoice Ninja']) }}
+                                    </a>
+                                </p>
+                            </td>
+                        @endif
+                    @endif
+                </tr>
+            </table>
+        </td>
+    </tr>
+</table>
 </body>
 
-<footer class="p-4">
-	{!! $footer !!}
-</footer>
+</html>
 
-@if(!$whitelabel)
-	<div style="display: block; margin-top: 1rem; margin-bottom: 1rem;">
-		<a href="https://invoiceninja.com" target="_blank">
-			{{ __('texts.ninja_email_footer', ['site' => 'Invoice Ninja']) }}
-		</a>
-	</div>
-@endif
-
-</html>
\ No newline at end of file