Fix filters image ratio display

[skjnldsv]

Before	After

Fix #253
Fix nextcloud/viewer#1335

[skjnldsv]

Ping @amrelbialy :)

EDIT, maybe @amrw-js ?

[amrelbialy]

Hey @skjnldsv, We don't consider this as a bug as it was implemented this way. The filters don't need to be aligned with image ratio as we are showing small fixed preview and when you click on any filter you can see the correct ration of the image with correct filter.

[skjnldsv]

@amrelbialy squashing the images preview is not a bug to you?
This makes this UI looks broken. If you're showing a preview, make sure you're keeping its ratio, no?
I'm also fine if you prefer to crop the image into a square. But squashing and changing the image ratio is definitely not acceptable I think 😉

We don't consider this as a bug as it was implemented this way

We could say that to literally all bugs existing in the world 😁

[skjnldsv]

Here is a more realistic example

[nimishavijay]

Agreed with @skjnldsv, cropping the image for a preview is okay, but warping it may give a wrong impression of what the filter would do :) a cropped square preview would be useful when there are multiple aspect ratios in a row, but since all the previews are of the same image, we don't have to crop it either. So nice work @skjnldsv :)

[jancborchardt]

Looks much better :)

[AhmeeedMostafa]

Code is approved but after reviewing the PR's UI & Behavior it's better to replace with center cropping behavior for aligning UI dimensions in all cases considering small & large screens.

Cropping behavior will be considered in the new release