Wowchemy-hugo-modules: Fixed size icon/tile for all project preview images on the homepage

[jananiravi]

Is there a way to have equal sized preview images/tiles for different projects? Some small square/rectangular dimensions can be set by you @gcushen or the user. Once there's a uniform size, I won't have to worry about the size of the image that I'm importing as preview images for different projects. they will all align nicely on the homepage.
Does this sound like a reasonable request? If not, could you suggest a simple workaround for me in the meantime? _Thanks!_

[fabrizziosoares]

I don't know, but it sounds interesting for me. Also, if it would be possible to have project cards with fixed size also. So if the project title is too big, it can be shortened with "..." (ellipsis) and how is interested on it can click and read full description.

[jananiravi]

Another good example of fixed tile-widths that are left-aligned https://compcogscisydney.org/projects/

[fabrizziosoares]

I loved that! Is it possible to do it on Hugo-academics?

[CommonClimate]

+1 for this feature. I would highly welcome it

[dambach]

You can do

.card .card-image {
display: block;
position: relative;
max-width: 200px;
}

in custom.css

Cheers

[CommonClimate]

thank you for the suggestion. Silly question: where does custom.css live? I don't see this file in my directory tree, and assume I need to create one. Should it go in the "public" folder?

[gcushen]

@CommonClimate please refer to the documentation on customization: https://sourcethemes.com/academic/docs/customization/#customize-style-css

[CommonClimate]

thanks - I had missed that.

[nfaivre]

Hi guys, thanks for the great theme!
The trick provided by dambach is nice, but could be improved.
When limiting max width, there's some extra white space around the card image, which is therefore not centered anymore. And it would be nice to also apply it to the image's height at the same time without changing the aspect ratio.
Any idea to resize automatically the image with a given aspect ratio, so all images fit the same card?
Cheers!

[Bertbk]

To center the image add margin:auto; and it should do the work.
Keeping a specific ratio is not that easy in simple css but you can find some ideas on stackoverflow

[gcushen]

Having a fixed project image size is now the default, see #708.