Mike Levin SEO

Future-proof your technology-skills with Linux, Python, vim & git... and me!

← Making YouTube Embeds 100% Width But Fixed Aspect Ratio Height
Pushing Blogslicer to PyPI (From Jupyter Notebook) →

Sharpening My Prev/Next Arrows

by Mike Levin

Sunday, May 01, 2022

It turned out that what was “most broken” in my opinion was the formatting of the previous/next arrows. I put so much effort into just having them at all over the past day that it’d be silly to stop before I tweaked them to an acceptable point. You’re probably looking at them now. Makes you want to click them, doesn’t it? Well, here’s the secret sauce.

Here’s the style.scss

---
---

@import 'jekyll-theme-hacker';

.spacer {
    padding-top: 1.5em;
    padding-bottom: 1.5em;
}

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

.post-nav-prev {
    text-align: left;
}

.post-nav-next {
    text-align: right;
}

And here’s the post.html. I use a very old-school non-breaking-space trick here, but it works super-well. There’s some flexbox wrangling here and its flex sub-command I’m still getting a handle on. I may make it more elegant in the future, but the way it displays certainly looks elegant.

And of course the other tired old trick of yet-another-div because padding or whatever doesn’t work correctly on the inner one.

…opps, apparently I can’t show you that until I learn about neutralizing and escaping Jekyll blog post Liquid directives better.

Oh, and the reason vim is better than emacs is because