diff --git a/app/Services/PdfMaker/Designs/Playful.php b/app/Services/PdfMaker/Designs/Playful.php
index 1e1db7661ff1..e9bb71bc0eaf 100644
--- a/app/Services/PdfMaker/Designs/Playful.php
+++ b/app/Services/PdfMaker/Designs/Playful.php
@@ -133,21 +133,7 @@ class Playful extends BaseDesign
         return  [
             ['element' => 'thead', 'content' => '', 'properties' => ['class' => 'text-left bg-teal-600'], 'elements' => $this->buildTableHeader()],
             ['element' => 'tbody', 'content' => '', 'elements' => $this->buildTableBody()],
-            ['element' => 'tfoot', 'content' => '', 'elements' => [
-                ['element' => 'tr', 'content' => '', 'elements' => [
-                    ['element' => 'td', 'content' => '$entity.public_notes', 'properties' => ['class' => 'border-l-4 border-white px-4 text-right', 'colspan' => '4']],
-                    ['element' => 'td', 'content' => '$subtotal_label', 'properties' => ['class' => 'px-4 py-4 text-right', 'colspan' => '2']],
-                    ['element' => 'td', 'content' => '$subtotal', 'properties' => ['class' => 'px-4 py-2 text-right']],
-                ]],
-                ['element' => 'tr', 'content' => '', 'elements' => [
-                    ['element' => 'td', 'content' => '$discount_label', 'properties' => ['class' => 'border-l-4 border-white px-4 text-right', 'colspan' => '6']],
-                    ['element' => 'td', 'content' => '$discount', 'properties' => ['class' => 'px-4 py-2 text-right']],
-                ]],
-                ['element' => 'tr', 'content' => '', 'properties' => ['class' => 'mt-8 px-4 py-2'], 'elements' => [
-                    ['element' => 'td', 'content' => '$balance_due_label', 'properties' => ['class' => 'border-l-4 border-white px-4 text-right font-semibold text-teal-600', 'colspan' => '6']],
-                    ['element' => 'td', 'content' => '$balance_due', 'properties' => ['class' => 'px-4 py-2 text-right']],
-                ]],
-            ]],
+            ['element' => 'tfoot', 'content' => '', 'elements' => $this->tableFooter()],
         ];
     }
 
@@ -186,4 +172,35 @@ class Playful extends BaseDesign
 
         return $elements;
     }
+
+    public function tableFooter()
+    {
+        return [
+            ['element' => 'tr', 'content' => '', 'elements' => [
+                ['element' => 'td', 'content' => '$entity.public_notes', 'properties' => ['class' => 'border-l-4 border-white px-4 text-right', 'colspan' => '4']],
+                ['element' => 'td', 'content' => '$subtotal_label', 'properties' => ['class' => 'px-4 py-4 text-right', 'colspan' => '2']],
+                ['element' => 'td', 'content' => '$subtotal', 'properties' => ['class' => 'px-4 py-2 text-right']],
+            ]],
+            ['element' => 'tr', 'content' => '', 'elements' => [
+                ['element' => 'td', 'content' => '$discount_label', 'properties' => ['class' => 'border-l-4 border-white px-4 text-right', 'colspan' => '6']],
+                ['element' => 'td', 'content' => '$discount', 'properties' => ['class' => 'px-4 py-2 text-right']],
+            ]],
+            ['element' => 'tr', 'content' => '', 'properties' => ['class' => 'mt-8 px-4 py-2'], 'elements' => [
+                ['element' => 'td', 'content' => '$partial_due_label', 'properties' => ['class' => 'border-l-4 border-white px-4 text-right', 'colspan' => '6']],
+                ['element' => 'td', 'content' => '$partial_due', 'properties' => ['class' => 'px-4 py-2 text-right']],
+            ]],
+            ['element' => 'tr', 'content' => '', 'properties' => ['class' => 'mt-8 px-4 py-2'], 'elements' => [
+                ['element' => 'td', 'content' => '$outstanding_label', 'properties' => ['class' => 'border-l-4 border-white px-4 text-right', 'colspan' => '6']],
+                ['element' => 'td', 'content' => '$outstanding', 'properties' => ['class' => 'px-4 py-2 text-right']],
+            ]],
+            ['element' => 'tr', 'content' => '', 'properties' => ['class' => 'mt-8 px-4 py-2'], 'elements' => [
+                ['element' => 'td', 'content' => '$invoice_total_label', 'properties' => ['class' => 'border-l-4 border-white px-4 text-right', 'colspan' => '6']],
+                ['element' => 'td', 'content' => '$invoice_total', 'properties' => ['class' => 'px-4 py-2 text-right']],
+            ]],
+            ['element' => 'tr', 'content' => '', 'properties' => ['class' => 'mt-8 px-4 py-2'], 'elements' => [
+                ['element' => 'td', 'content' => '$balance_due_label', 'properties' => ['class' => 'border-l-4 border-white px-4 text-right font-semibold text-teal-600', 'colspan' => '6']],
+                ['element' => 'td', 'content' => '$balance_due', 'properties' => ['class' => 'px-4 py-2 text-right']],
+            ]],
+        ];
+    }
 }
diff --git a/tests/Feature/PdfMaker/ExampleIntegrationTest.php b/tests/Feature/PdfMaker/ExampleIntegrationTest.php
index 2b10162b73ae..5a7817ec387b 100644
--- a/tests/Feature/PdfMaker/ExampleIntegrationTest.php
+++ b/tests/Feature/PdfMaker/ExampleIntegrationTest.php
@@ -15,13 +15,10 @@ class ExampleIntegrationTest extends TestCase
 
     public function testExample()
     {
-        $this->markTestSkipped('WIP');
-
-
         $invoice = Invoice::first();
         $invitation = $invoice->invitations()->first();
 
-        $engine = new HtmlEngine($invitation, 'invoice');
+        $engine = new HtmlEngine(null, $invitation, 'invoice');
         $design = new Playful();
 
         $product_table_columns = json_decode(