about summary refs log tree commit diff
path: root/app/javascript/flavours/glitch/styles
diff options
context:
space:
mode:
authorThibaut Girka <thib@sitedethib.com>2018-04-08 23:18:24 +0200
committerThibaut Girka <thib@sitedethib.com>2018-04-08 23:18:24 +0200
commita4fa8c9064702167412a39901811430822440d11 (patch)
tree5c66a3f6de01ffb5dfb2f2a7e71b0c7f1085b901 /app/javascript/flavours/glitch/styles
parent87071d9e8133daf60f5c253fdc4250086e342143 (diff)
[Glitch] Avoid using JS to set height in MediaModal
Port fa5c867e0ec426fc01653e9022ba29783b2a826f to glitch-soc
Diffstat (limited to 'app/javascript/flavours/glitch/styles')
-rw-r--r--app/javascript/flavours/glitch/styles/components/media.scss13
1 files changed, 6 insertions, 7 deletions
diff --git a/app/javascript/flavours/glitch/styles/components/media.scss b/app/javascript/flavours/glitch/styles/components/media.scss
index 31dbb7f58..588e8d558 100644
--- a/app/javascript/flavours/glitch/styles/components/media.scss
+++ b/app/javascript/flavours/glitch/styles/components/media.scss
@@ -171,8 +171,12 @@
   img,
   canvas,
   video {
-    max-width: 100vw;
-    max-height: 100vh;
+    max-width: 100%;
+    /*
+    put margins on top and bottom of image to avoid the screen coverd by
+    image.
+     */
+    max-height: 80%;
     width: auto;
     height: auto;
     margin: auto;
@@ -184,11 +188,6 @@
     background: url('~images/void.png') repeat;
     object-fit: contain;
   }
-
-  .react-swipeable-view-container {
-    width: 100vw;
-    height: 100%;
-  }
 }
 
 .media-modal__closer {