From 0a3982c2a4bd096c1d9d556652a85157df2c2091 Mon Sep 17 00:00:00 2001
From: Jeffrey Biles <bilesjeffrey@gmail.comgit config -l>
Date: Wed, 18 Mar 2020 13:29:53 -0700
Subject: [PATCH] Move modal into a portal, just because we can

---
 src/App.vue                  |  2 ++
 src/components/MailTable.vue | 10 ++++++----
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index ddb473b..b294bbb 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -17,6 +17,8 @@
         <p>Loading...</p>
       </template>
     </suspense>
+
+    <div id="modal-portal"></div>
   </div>
 </template>
 
diff --git a/src/components/MailTable.vue b/src/components/MailTable.vue
index 0417fbe..d9af5b6 100644
--- a/src/components/MailTable.vue
+++ b/src/components/MailTable.vue
@@ -18,11 +18,13 @@
         <td class="date">{{format(new Date(email.sentDate), 'MMM do yyyy')}}</td>
       </tr>
     </tbody>
-  </table>
 
-  <ModalView :isOpened="!!openedEmail" :closeModal="() => {openedEmail = null;}">
-    <MailView :email="openedEmail" />
-  </ModalView>
+    <portal target="#modal-portal">
+      <ModalView :isOpened="!!openedEmail" :closeModal="() => {openedEmail = null;}">
+        <MailView :email="openedEmail" />
+      </ModalView>
+    </portal>
+  </table>
 </template>
 
 <script>