commit: d1c3e35d3fe707b916e428c376fa0d89e4824ec5
parent: a6328fc1b17984af71efb9a1214437c8cdc5dfea
Author: Lynx Kotoura <lynx@lv9.org>
Date:   Sun, 16 Jul 2017 18:52:11 +0900
Fix style settings for images in media modal (#4220)
* Shrink too wide single image modal
Fix too wide react-swipeable-view-container
Fix 0067f80 shrinking all react-swipeable-view-container
Change to apply max-width of react-swipeable-view-container only under media-modal.
Fix b30b03b just a typo
* Centering contents in image-loader
Centering small img, canvas, and video in image-loader.
Diffstat:
1 file changed, 8 insertions(+), 3 deletions(-)
diff --git a/app/javascript/styles/components.scss b/app/javascript/styles/components.scss
@@ -1143,8 +1143,8 @@
     top: 0;
     left: 0;
     right: 0;
-    width: 100%;
-    height: 100%;
+    max-width: 100%;
+    max-height: 100%;
     background-image: none;
   }
 
@@ -2967,8 +2967,9 @@ button.icon-button.active i.fa-retweet {
   video {
     max-width: 80vw;
     max-height: 80vh;
-    width: 100%;
+    width: auto;
     height: auto;
+    margin: auto;
   }
 
   .extended-video-player,
@@ -2984,6 +2985,10 @@ button.icon-button.active i.fa-retweet {
     background: url('../images/void.png') repeat;
     object-fit: contain;
   }
+
+  .react-swipeable-view-container {
+    max-width: 80vw;
+  }
 }
 
 .media-modal__close {