It's been a long time since last I showed some love for the UI of this blog, and after a day of modifications I'm pretty excited about the outcome :w00t:
So, what has changed?
I like simple things and I always wanted the same thing for my blog. Few years ago, I had come across a static site built with jekyll and loved its simplicity. My new theme is heavilly inspired by https://uberspot.github.io, hence the name I decided to give it. This nice feature of rotating pictures with every new visit isn't implemented yet for pelican, but it's in my plans.
Vincent Bernat's blog has also been an inspiration and you'll see many css styles taken from there, for example the table of contents. Apart from design patterns, he is writing some very cool stuff so I urge you to follow him.
I prefer the light themes over the darks ones, but not too bright. The background is taken from subtle patterns, an awesome site that has many patterns to choose from. I went with paper fibers and I like the outcome so far.
The main font used is Merriweather from Google's webfonts and was inspired to use by Vincent's blog.
Code blocks are styled after Mozilla's Developer Network, here is a sample taken form here:
var foo = 42; // foo is a Number now var foo = "bar"; // foo is a String now var foo = true; // foo is a Boolean now
Blockquotes are restyled to use sharp edges and a light orange color:
Look, let me explain something. I'm not Mr. Lebowski. You're Mr. Lebowski. I'm the Dude. So that's what you call me. That, or Duder, or His Dudeness, or El Duderino, if you're not into the whole brevity thing.
New plugins used
Pelican has a very active community and its powerful structure make it dead easy to add a plugin or even write your own. Head over the pelican-plugins repo and see your options.
For the time being I chose to use three plugins that add some pretty nice functionality to the UI and UX.
There isn't much information in the docs how to set it up, but after a little search, I found some articles that explained it in depth.
The neighbors plugin adds
next_article (newer) and
variables to the article's context.
As you'll see I added some nice bowling pins icons to show you the way :)
A really nice plugin is the post_stats which calculates various statistics
about a post and stores them in an
Now you get the average time to read a post, and if you hover over it, you also see the total words written.
As always, the source code is available to take a look and hack on. I haven't yet submitted it to the pelican-themes repo as I need to sort some things and clean it up a bit.