about summary refs log tree commit diff
path: root/app
diff options
context:
space:
mode:
authorLynx Kotoura <lynx@lv9.org>2017-07-16 18:52:11 +0900
committerEugen Rochko <eugen@zeonfederated.com>2017-07-16 11:52:11 +0200
commitd1c3e35d3fe707b916e428c376fa0d89e4824ec5 (patch)
treedd49e2dab80918b1f36fcba6eddaa92779fe7534 /app
parenta6328fc1b17984af71efb9a1214437c8cdc5dfea (diff)
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 (limited to 'app')
-rw-r--r--app/javascript/styles/components.scss11
1 files changed, 8 insertions, 3 deletions
diff --git a/app/javascript/styles/components.scss b/app/javascript/styles/components.scss
index fc797a508..1c4c97f18 100644
--- 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 {