[Bug ] Fix Unnecessary large white space around small pictures in Posts UI

[sinaamini92]

Describe the bug
the small pictures when posted have extra-ordinarily white space around them

To Reproduce
Steps to reproduce the behavior:

1. Go to home
2. post a small picture
3. See error

Expected behavior
to have a smaller card for post

Screenshots

Desktop:

• OS: Ubuntu 20.04 LTS
• Browser: chrome Version 90.0.4430.212 (Official Build) (64-bit)

[Qolzam]

Dear @sinaamini92 ,

Thank you for notice🪴

Not sure if this can be improve as we expect. Because the image can be contained(like previous) or like now scale-down.
For now I don't have any idea how to make this the ideal way we want. However I checked other Social Networks like facebook that use contained image style, by that let me revert the style to previous state (contained style) and we think of a better solution later.
I am going to set it on lowest priority.

[sinaamini92]

@Qolzam i think there's an easy way to fix this, just adjust the height of the card to match the height of the picture and it will be fixed

[Qolzam]

Thank you @sinaamini92 for suggestion 🙂
Can you provide a demo? Image will be in different height so changing the height of card dynamically with a simple solution is perfect 👍

[sinaamini92]

this would be the standard card to show a picture. rules would be :
1- image-viewbox in the card should have a limited height (e.g.: like not less than 100px and not more than 600px)
2- shouldn't up-scale the image and if only the width/height exceeds the limited px for width(which is fixed) or height it should down-scale to fit the borders.
3- and the image-box should be larger than the image (unless the limit has reached (like 100px))

[Qolzam]

this would be the standard card to show a picture. rules would be :
1- image-viewbox in the card should have a limited height (e.g.: like not less than 100px and not more than 600px)
2- shouldn't up-scale the image and if only the width/height exceeds the limited px for width(which is fixed) or height it should down-scale to fit the borders.
3- and the image-box should be larger than the image (unless the limit has reached (like 100px))

Not sure how it can works in practice 🤔