MIKE LEVIN LPVG SEO

Future-proof your tech-skills with Linux, Python, vim & git as I share with you the most timeless and love-worthy tools in tech — and on staying valuable while machines learn... and beyond.

Adding Style Sheets to Github Pages Jekyll Blog

by Mike Levin

Saturday, April 30, 2022

Okay, that was easy, adding the prev/next arrows to Jekyll blogs. But I’m not quite done. There’s some CSS that completes the project.

It was a bit tricky to figure out. I don’t normally do the sass css generators, but it’s built into Jekyll. The default css for Jekyll is the type of thing you download and put in location locally just like a default.html or post.html. And like them, there will be some transformations occurring, but instead of just using a style.css you use a style.scss which does an import:

---
---

@import 'jekyll-theme-hacker';

Using the CSS provided at the article I’m working off of, I guessed that you simply paste it underneath:

---
---

@import 'jekyll-theme-hacker';

.post-nav {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.post-nav p {
    flex: 1 1 0;
    width: 45%;
}

.post-nav p:first-child {
    padding-right: 0.5em;
}

.post-nav p:last-child {
    padding-left: 0.5em;
    text-align: right;
}