duncanlock.net
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”

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”

This site has been generated using Pelican 3.3 for over two years - and I finally found some time to upgrade to the current version of Pelican, 3.6.3. This is how I did the upgrade.

I decided to be lazy and do the upgrade in-place, instead of creating a new virtualenv and copying the content & settings over. Luckily, this worked out OK, after a bit of fiddling around.

I also decided, rather cavalierly, to upgrade all the packages in the virtualenv to their latest versions while I was at it. To do this, I upgraded pip, then used pip-review. To upgrade pip & install pip-review system wide, run this on the command line:

$ sudo -H pip install --upgrade pip
$ sudo -H pip install pip-review

Then upgrade eveything in the sites virtualenv:

$ sudo apt-get install libjpeg-dev
$ workon duncanlock.net
$ pip-review …
Continue reading “How I upgraded this website to Pelican 3.6”

$ sudo su -

$ mkfs.btrfs -f /dev/sdb
$ mkfs.btrfs -f /dev/sdc

$ btrfs fi show

Should give you output something like this:

Cannot analyze code. No Pygments lexer found for “txt”.

.. code-block:: txt

        Label: none  uuid: bfee4bb4-3886-406f-94df-cb2dcf42f044
                Total devices 1 FS bytes used 112.00KiB
                devid    1 size 5.00GiB used 548.00MiB path /dev/sdc

        Label: none  uuid: a0192bd3-a8f7-477b-9bae-fea9a48aa1ab
                Total devices 1 FS bytes used 2.24GiB
                devid    1 size 5.00GiB used 3.04GiB path /dev/sdb

        Btrfs v3.12

$ mkdir /mnt/butter

$ mount /dev/sdb /mnt/butter $ btrfs device add -f /dev/sdc /mnt/butter

$ btrfs fi show

Label: none  uuid: a0192bd3-a8f7-477b-9bae-fea9a48aa1ab
        Total devices 2 FS bytes used 2.24GiB
        devid    1 size 5.00GiB used 3.04GiB path /dev/sdb
        devid    2 size 5.00GiB used 0.00 path /dev/sdc

Btrfs v3.12

$ btrfs fi …
Continue reading “Setting up a Raid1 Btrfs Home partition”

To create image thumbnails from a PDF document, run this in a terminal window:

$ convert -thumbnail x300 -background white -alpha remove input_file.pdf[0] output_thumbnail.png

The parameters to convert do the following things:

ParameterEffect
-thumbnailSimilar to -resize, but optimized for speed and strips metadata.
x300Make the thumbnail 300px tall, and whatever width maintains the aspect ratio.
-background whiteSets the thumbnail background to white.
-alpha removeRemoves the alpha channel from the thumbnail output.
input_file.pdfThe PDF file to use as input.
[0]The page number of the input file to use for the thumbnail.
output_thumbnail.pngThe output thumbnail file to create.

If you want larger thumbnails, just change the x300 parameter to match. If you want to output .jpg’s (or anything else, like .gif), just change the file …

Continue reading “How to create thumbnails for PDFs with ImageMagick on Linux”

There are quite a few changes in Pelican 3.3 - most of them minor, but a few which might mean making some changes to your site in order to upgrade. This is what I did to move my site from Pelican 3.2 to 3.3.

The change that had the biggest impact and took the most work was around image linking - caused by a combination of things. I think I was doing it wrong before and things changed in a way that meant this no longer worked. I also had to update my Better Figures & Images plugin to take this into account.

Previously, I’d been linking to my images like this, both in my theme:

/* Theme CSS Image Link */
background: #2C71B8 url(/static/images/blueprint-background.png) repeat;
{# Theme HTML/Jinja image link #}
<meta name="twitter:image" content …
Continue reading “How I upgraded this website to Pelican 3.3”

https://github.com/kragen/xcompose

Continue reading “How to add new Compose Key combinations on Linux”

Continue reading “The smart guide to optimizing images for the web: Zero to Hero”

I’m going to build on Jamie Zawinski’s excellent advice about backups, which you should read first. This is basically that, but with some extra bits. If this seems too complex, then just do what he says.

The plan is to use Backupninja to backup everything to an external USB drive – and also to Amazon S3 or Dropbox, depending on what it is. Backupninja provides a centralized way to configure and schedule many different backup utilities, just by dropping a few simple configuration files into /etc/backup.d/.

I have a multiple hard disk setup for my desktop Linux box - my /home folders live on one disk and / lives on another one. I don’t want to backup everything from the system disk - I can re-install it in 10 mins, and I don’t really want to complicate this …

Continue reading “Comprehensive Linux Backups with etckeeper & backupninja”

I recently needed to convert some FLAC music files from the increasingly common 48 bit encoding, down to 16 bit at 44100 kHz, so that they’ll play on my Sonos. Here’s how to do it:

If you don’t already have sox installed, do this to install it:

$ sudo apt-get install sox

Then run this to do the conversion, in the folder with music in:

$ mkdir resampled
$ for flac in *.flac; do sox -S "${flac}" -r 44100 -b 16 ./resampled/"${flac}"; done

And that’s it - it will convert all the .flac files in that folder to 16 bit at 44100 kHz and put the result into the ./resampled subfolder, preserving the metadata.

Continue reading “How to convert FLAC files from 24/48 bit to 16 bit on Ubuntu Linux”