Prevent thumbnail overflow in file info

[lehecht]

Closes #1016.

[lehecht]

I had to add the width and height properties because object-fit: contain wouldn’t work otherwise. However, this caused portrait thumbnails to enlarge, so I need to check whether a thumbnail is a portrait or landscape image.

[mzur]

I assume this is no longer a draft?

[mzur]

I think a single max-width: 100% would work here, too? Then there is no need for object-fit, height or the @if.

[lehecht]

@mzur
Indeed, object-fit is not needed for landscape thumbnails, but portrait thumbnails are still displayed enlarged when using max-width: 100%.

Left: before change
Right: after change

|

[mzur]

Maybe add a max-height with a fixed pixel value then? I'd just like to avoid the @if check in the template, as this is basically just a CSS issue.

[lehecht]

Sorry, I overlooked that I was still using width instead of max-width, so my previous comment is wrong. Using only width would have worked for landscape thumbnails only, but using object-fit with max-width: 100% and max-height: 100% works for all thumbnails without Blade directives.

[mzur]

Is the object-fit required at all now? Also I think a max-height: 100% has no effect. Better would be a max-height: 270px (as this is the default thumbnail size).

[lehecht]

Is the object-fit required at all now? Also I think a max-height: 100% has no effect. Better would be a max-height: 270px (as this is the default thumbnail size).

I removed object-fit and max-height since they are unnecessary for preventing the thumbnail from overflowing the container.