hugo-toha / toha

A Hugo theme for personal portfolio
https://hugo-toha.github.io
MIT License
1.05k stars 605 forks source link

Allow to customize image fit in gallery component from achievements section #994

Open juan11iguel opened 1 month ago

juan11iguel commented 1 month ago

As it stands, the default background-size property from the gallery component in the achievements section, which is set to cover, is the only fit option for images. Which makes images look wrong more often that not:

Screenshot from 2024-10-04 12-45-19 Screenshot from 2024-10-04 12-45-35

Quick solution

A quick fix could be to expose an option in the template to setup how images should be fit, to allow for example the contain setting: Screenshot from 2024-10-04 12-48-28

It is not ideal, but at least images look correct.

Better solution

Ideally, maybe the gallery component could be replaced by a smarter one? One that would create a grid based on the ratios of the images it is given. This is how it works for example in hugo-theme-gallery, which in my experience makes images look good in a very wide range of ratios and formats you throw at it.

Screenshot from 2024-10-04 12-59-03 image

Thanks for the project! Best regards

hossainemruz commented 2 days ago

The best thing will be to replace the gallery component with a better one.