me/glitchier-soc
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Fix broken letterboxing in media previews

Browse source
This commit is contained in:
Ondřej Hruška 2017-07-15 15:38:18 +02:00
parent 50b74eeb08
commit c0a93f5f26
1 changed files with 5 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
app/javascript/styles/components.scss
View file

@ -3954,13 +3954,14 @@ button.icon-button.active i.fa-retweet {
.media-gallery__item-thumbnail { .media-gallery__item-thumbnail {
cursor: zoom-in; cursor: zoom-in;
display: block;
text-decoration: none; text-decoration: none;
width: 100%; width: 100%;
height: 100%; height: 100%;
display: flex;
img { img {
width: 100%; width: 100%;
object-fit: contain;
&:not(.letterbox) { &:not(.letterbox) {
height: 100%; height: 100%;
@ -3974,6 +3975,8 @@ button.icon-button.active i.fa-retweet {
overflow: hidden; overflow: hidden;
position: relative; position: relative;
width: 100%; width: 100%;
display: flex;
justify-content: center;
} }
.media-gallery__item-gifv-thumbnail { .media-gallery__item-gifv-thumbnail {
@ -3981,6 +3984,7 @@ button.icon-button.active i.fa-retweet {
height: 100%; height: 100%;
position: relative; position: relative;
z-index: 1; z-index: 1;
object-fit: contain;
&:not(.letterbox) { &:not(.letterbox) {
height: 100%; height: 100%;