Fixed post-card size for default casper theme


#1

First of all, I apologize if this kind of styling help or scripting help is deemed inappropriate for this forum. I will take this down if necessary.

What I would like to achieve is to have a fixed size/style of post-card on the blog front page of the casper theme. It seems that by default, the post-card adjusts its size (or perhaps better described as shape) to fill the page horizontally (See here for example). Where and how could I modify the theme to have a fixed shape of the post-card. Since it is dynamic, I am guessing it’s part of a JS script. But I am having trouble locating where it is.

Thanks for any help in advance!


#2

Hey Owen,

No, it’s totally fine to ask questions here. That’s what the forum is for. Many things you’ll find in our documentation, but in your particular case, you’ll have the read the source code of Casper.

The post card grid is not done with JS, but with plain CSS. Here is the base style for the post cards:

And here you’ll find the code section, that styles every 6n+1 nth post card as the full width card that you fancy:


#3

Huge thanks! This is extremely helpful. Thanks for such a detailed response :smiley: