Tag Icon in the shape of a luggage tag
Figure 1. This pages tag list is using this tag icon from FontAwesome. This is a 550 byte SVG file, 346 bytes gzipped.

If you want to use SVG icons on a website and style them with CSS - then the SVG needs to be inline - i.e. the SVG markup needs to be included with the rest of the pages HTML markup.

Unfortunately putting things inline means that they can’t be cached. In this article I’ll show one way to get around this - and get the best of both worlds: inline styleable SVG icons, with caching!

Continue reading “Styleable Inline SVG Icons, with Caching & Fallback”

How to find a git repositories default branch name

Two screenshots of the nginx Welcome page, side-by-side, showing the page before the change and afterwards. The one on the left is dark-on-light and the one on the right is light-on-dark.
Figure 1. The nginx “Welcome” page, before & after my intended change.

I wanted to add dark mode support to the default nginx “Welcome to nginx” page. This is about the simplest change I could choose to make - it’s a simple, backwards compatible, small additive change to one single index.html file. My initial version of this change looks like this, and is added to the files <style> element, in the <head> section:

@media (prefers-color-scheme: dark) {
  body {
    background-color: #363839;
    color: #d1cec9;
  a {
    color: #c4c4ff;

So, this is the process of getting that change from my brain, into the upstream nginx codebase. 

Continue reading “How to Contribute a Change to Nginx”

cssmin is unmaintained & has a bug with complex :is selectors

Sometimes I want to have a just a tiny bit of CSS that’s unique, just for one page or post. I don’t want a whole stylesheet, or to have to add this to my site-wide theme, just for one post – I want a simple way to add it in the post itself.

This is how I did it:

Continue reading “Custom Per Page CSS With Pelican”

You can use the new CSS :is selector to write complex CSS selectors in a much more compact way

How to allow python (or anything else) to listen/bind to port 80 without being root

Ninja is a surprisingly nice build system for tiny projects. That's more or less the opposite of what it's designed for, but it works really well for tiny things.

The content-type guessing done by AWS CLI is based on the mimetype definitions available on your system. You can improve the mimetype guessing by updating these definitions.

I had an issue where the AWS CLI wasn't guessing the content-type of SVG files correctly on sync and was setting them to `application/octet-stream` - the default "I don't know" mimetype. This is a quick fix for that.