Originally when writing the blog, I just copied some styles from a [blog][1] and [site][2] that I liked, but now it's time to actually apply a fresh coat of paint.
My goal is nothing flashy, just making the text and layout of the blog really easy to read.
In the same spirit of "build-a-blog", I will start from scratch and write and take notes as I go.
CSS in 2025 is really insane to look at compared to the early-mid 2010s where most of my experience lies.
* [Custom properties (variables)][3]
* [Grid layouts][4]
* [Nesting and child selectors][5]
* [Built in color-scheme light/dark helper][6]
All the nice features are right there and well supported making a preprocessor or polyfilling unnecessary.
A few tools that will make this a bit easier:
A static file server with sane defaults for local dev and static pages: <https://codeberg.org/cfebs/srv>
Basically just a golang `http.FileServer` that uses `Cache-Control: "no-cache, no-store"`
And something to run our build when files change that I call `~/bin/make-watch`
```bash
#!/usr/bin/env bash
dir="$(pwd)"
if [[ -n "$1" ]]; then
dir="$1"
shift
fi
last_run_seconds=0
grace_seconds=1
inotifywait -r -m -e modify -e create -e delete "$dir" --format "%e" | while read -r event; do
if [[ $SECONDS -gt $((last_run_seconds + grace_seconds)) ]]; then
# reset last_run_seconds if enough time has elapsed
# do not consider a make run if seconds falls between the last run and grace period
continue;
fi
make "$@"
last_run_seconds="$SECONDS"
done
```
Lets go!
## From scratch
Firstly I want to make sure this looks decent across many browsers. So that means considering a normalize or CSS reset.
https://github.com/necolas/normalize.css is probably the gold standard of this still to this day. So lets just minify it and dump it at the head of our `style.css` file
