PicoCSS - merged
Quite some time ago, I looked at switching from Bootstrap to PicoCSS, but I didn’t end up going through with it. I don’t remember all the problems that I had, but I managed to, while not having any internet this weekend, solve a couple of them.
Getting rid of the dark backgrounds on the syntax-highlighted code blocks was easy enough, I just had to add this to my config:
pygmentsUseClasses: true
This has, of course, left me without syntax highlighting at all, as it just sets the classes and then expects CSS to actually pick the colours, and I do not have any CSS set up for that. But I’m actually okay with that, the defaults are mostly readable, and I can pick colours later on… I just need to find a theme (or potentially hack one together) which supports auto light/dark mode and remains readable on both. Easy, but a task for another day.
The only other thing I can think of that’s bothering me is the header image doesn’t really work properly for light mode… but I think I can fix that later when I get around to it.
In order to fully benefit from it, I need to subset font-awesome, since I only use about seven of the glyphs I don’t need all 180KB of it. I could have them do this, but looking into it, they want $150/yr for the ability to do that… that’s a tough sell for someone like me with no design intentions. In fact I’m starting to wonder whether a PNG of sprites mightn’t be a better solution, abandoning font-awesome completely? Heck even if I did separate PNGs it’s still going to come in at less load time on a very slow link, I think - at the cost of losing perfect scaling. SVGs?
For now, I don’t know if I care enough. I’m still sub-megabyte first page load if there’s no images on the front page - around 500KB, and approximately 250KB or so of that is font-awesome.
I think the first order of business is to sort out improving the contrast of the light-mode text, and any other associated annoyances with it.
