diff --git a/src/components/MailTable.vue b/src/components/MailTable.vue
index b679d2e..b23ee3c 100644
--- a/src/components/MailTable.vue
+++ b/src/components/MailTable.vue
@@ -18,8 +18,8 @@
     </tbody>
   </table>
 
-  <ModalView v-if="openedEmail">
-    <MailView :email="openedEmail" />
+  <ModalView v-if="openedEmail" :closeModal="() => { openedEmail = null; }">
+    <MailView v-if="openedEmail" :email="openedEmail" />
   </ModalView>
 </template>
 
diff --git a/src/components/ModalView.vue b/src/components/ModalView.vue
index e9978e3..1543522 100644
--- a/src/components/ModalView.vue
+++ b/src/components/ModalView.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="modal">
-    <div class="overlay"></div>
+    <div class="overlay" @click="closeModal"></div>
     <div class="modal-card">
       <slot />
     </div>
@@ -9,7 +9,12 @@
 
 <script>
   export default {
-    
+    props: {
+      closeModal: {
+        type: Function,
+        required: true
+      }
+    }
   }
 </script>