From dbb746ff34df3b51f0f5186b01f0e3c1a25aef89 Mon Sep 17 00:00:00 2001
From: Nolan Lawson <nolan@nolanlawson.com>
Date: Fri, 13 Sep 2019 22:11:22 -0700
Subject: [PATCH] fix: media modal uses full height on mobile (#1481)

fixes #1465
---
 .../_components/dialog/components/MediaDialog.html  | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/routes/_components/dialog/components/MediaDialog.html b/src/routes/_components/dialog/components/MediaDialog.html
index 5cb6fe04..eee340cb 100644
--- a/src/routes/_components/dialog/components/MediaDialog.html
+++ b/src/routes/_components/dialog/components/MediaDialog.html
@@ -86,11 +86,11 @@
 <Shortcut scope='modal-{id}' key="ArrowRight" on:pressed="next()" />
 <style>
   :global(.media-modal-dialog) {
-    max-width: calc(100%);
+    max-width: 100%;
   }
   .media-container {
     height: calc(100% - 64px); /* 44px X button height + 20px padding */
-    width: calc(100vw);
+    width: 100vw;
     display: flex;
     flex-direction: column;
   }
@@ -196,8 +196,15 @@
     .media-scroll-item {
       scroll-snap-coordinate: 0 0;
     }
-
   }
+
+  @media (max-width: 767px) {
+    .media-container {
+      height: calc(100vh - 64px);
+    }
+  }
+
+
 </style>
 <script>
   import ModalDialog from './ModalDialog.html'