Template for https://getgrav.org/blog?

Archive
1

What do I need to setup a page, that exactly looks like https://getgrav.org/blog ? Is there a template, plugin or even a skeleton, that provides this functionality?

Thank you very much for your help!

2

See this page, it’s all in the learning documents:

http://learn.getgrav.org/cookbook/create-a-blog

3

The “Blog Site” skeleton is already a starting point for a blog.

The Grav Blog uses a theme that’s not distributed to make it a bit special, but it’s just a little bit of CSS customization in the Blog Posts listing, plus some custom code to allow infinite loading.

4

I’m specifically interested in these card items. They are really great. Are they also included in the “Blog Site” skeleton?

5

Just create these cards in CSS, the hover effect is just a plain CSS3 box shadow property that changes upon hover + CSS3 transform

create the card in CSS, and add the below two properties to get the initial (before hover) state.

.your-card-class {
    transition: all 250ms ease 0s;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.12), 0px 1px 2px rgba(0, 0, 0, 0.24);
}

Then after you are satisfied with the way the card looks add the following :hover class.

.shortcut:hover {
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.19), 0px 6px 6px rgba(0, 0, 0, 0.23);
    transform: translateY(-5px);
}
---