about summary refs log tree commit diff
path: root/app/javascript/styles
diff options
context:
space:
mode:
authorOndřej Hruška <ondra@ondrovo.com>2017-07-15 15:38:18 +0200
committerOndřej Hruška <ondra@ondrovo.com>2017-07-15 15:38:18 +0200
commit3a526e2369c45e0e7e0eaea83d62c94587a82975 (patch)
treead5ed3e853d7a4d4dd11fa396273e08e3cb942ba /app/javascript/styles
parent51e3ac2534ba6fa95c035db27a859e5413311c9f (diff)
Fix broken letterboxing in media previews
Diffstat (limited to 'app/javascript/styles')
-rw-r--r--app/javascript/styles/components.scss6
1 files changed, 5 insertions, 1 deletions
diff --git a/app/javascript/styles/components.scss b/app/javascript/styles/components.scss
index b06c99c95..34539a9f4 100644
--- a/app/javascript/styles/components.scss
+++ b/app/javascript/styles/components.scss
@@ -3954,13 +3954,14 @@ button.icon-button.active i.fa-retweet {
 
 .media-gallery__item-thumbnail {
   cursor: zoom-in;
-  display: block;
   text-decoration: none;
   width: 100%;
   height: 100%;
+  display: flex;
 
   img {
     width: 100%;
+    object-fit: contain;
 
     &:not(.letterbox) {
       height: 100%;
@@ -3974,6 +3975,8 @@ button.icon-button.active i.fa-retweet {
   overflow: hidden;
   position: relative;
   width: 100%;
+  display: flex;
+  justify-content: center;
 }
 
 .media-gallery__item-gifv-thumbnail {
@@ -3981,6 +3984,7 @@ button.icon-button.active i.fa-retweet {
   height: 100%;
   position: relative;
   z-index: 1;
+  object-fit: contain;
 
   &:not(.letterbox) {
     height: 100%;