1 files changed, 5 insertions, 13 deletions
diff --git a/src/components/media_modal/media_modal.vue b/src/components/media_modal/media_modal.vue
index 06ced5a1..2597f4e3 100644
--- a/src/components/media_modal/media_modal.vue
+++ b/src/components/media_modal/media_modal.vue
@@ -1,9 +1,8 @@
 <template>
-  <div
+  <Modal
     v-if="showing"
-    v-body-scroll-lock="showing"
-    class="modal-view media-modal-view"
-    @click.prevent="hide"
+    class="media-modal-view"
+    @backdropClicked="hide"
   >
     <img
       v-if="type === 'image'"
@@ -33,21 +32,15 @@
     >
       <i class="icon-right-open arrow-icon" />
     </button>
-  </div>
+  </Modal>
 </template>
 
 <script src="./media_modal.js"></script>
 
 <style lang="scss">
-@import '../../_variables.scss';
-
-.media-modal-view {
+.modal-view.media-modal-view {
   z-index: 1001;
 
-  body:not(.scroll-locked) & {
-    display: none;
-  }
-
   &:hover {
     .modal-view-button-arrow {
       opacity: 0.75;
@@ -114,5 +107,4 @@
     }
   }
 }
-
 </style>