add syntax highlighting

6 files changed, 88 insertions, 18 deletions

diff --git a/flake.nix b/flake.nix
index 1c48918..a11f245 100644
--- a/flake.nix
+++ b/flake.nix
@@ -24,15 +24,22 @@
       systems = [ "x86_64-linux" ];
       perSystem =
         { config, pkgs, ... }:
+        let
+          deps = [
+            pkgs.soupault
+            pkgs.pandoc
+            pkgs.highlight
+          ];
+        in
         {
           packages = {
             default = config.packages.website;
 
             website = pkgs.stdenv.mkDerivation {
               pname = "sorre-website";
-              version = "2026-02-21";
+              version = "2026-02-21-patch-1";
               src = ./.;
-              nativeBuildInputs = [ pkgs.soupault pkgs.pandoc ];
+              nativeBuildInputs = deps;
               buildPhase = "soupault";
               installPhase = "cp -r build $out";
             };
@@ -70,7 +77,7 @@
               minimalMkShell = pkgs.mkShell.override { stdenv = stdenvMinimal; };
             in
             minimalMkShell {
-              packages = with pkgs; [ soupault ] ++ builtins.attrValues config.treefmt.build.programs;
+              packages = deps ++ builtins.attrValues config.treefmt.build.programs;
             };
 
           treefmt = {
diff --git a/highlight.css b/highlight.css
new file mode 100644
index 0000000..6e6cb30
--- /dev/null
+++ b/highlight.css
@@ -0,0 +1,24 @@
+/* Style definition file generated by highlight 4.18, http://andre-simon.de/ */
+/* highlight theme: Github Source View */
+body.hl	{ background-color:#ffffff; }
+pre.hl	{ color:#000000; background-color:#ffffff; font-size:10pt; font-family:'Courier New',monospace; white-space: pre-wrap; }
+.hl.num { color:#0086b3; }
+.hl.esc { color:#183691; }
+.hl.sng { color:#183691; }
+.hl.pps { color:#183691; }
+.hl.slc { color:#969896; }
+.hl.com { color:#969896; }
+.hl.ppc { color:#a71d5d; }
+.hl.opt { color:#000000; }
+.hl.ipl { color:#183691; }
+.hl.lin { color:#b2b2b2; user-select: none;-webkit-user-select: none; }
+.hl.hvr { cursor:help; }
+.hl.erm { color:#ff0000; font-weight:bold; border:solid 1px red; margin-left: 3em; }
+.hl.err { color:#ff0000; font-weight:bold; }
+.hl.kwa { color:#a71d5d; }
+.hl.kwb { color:#0086b3; }
+.hl.kwc { color:#0086b3; }
+.hl.kwd { color:#0086b3; }
+.hl.kwe { color:#a71d5d; }
+.hl.kwf { color:#38ae50; }
+
diff --git a/site/2023-11-15-scraping-images-from-open-tabs.md b/site/2023-11-15-scraping-images-from-open-tabs.md
index b0aebb6..75a768c 100644
--- a/site/2023-11-15-scraping-images-from-open-tabs.md
+++ b/site/2023-11-15-scraping-images-from-open-tabs.md
@@ -3,12 +3,14 @@
 <time id="post-upload-date">2023-11-15</time>
 <time id="post-update-date">2023-11-15</time>
 
-```zsh
+<!-- FIXME: shell highlighting doesn't work yet -->
+<pre><code>
 cat export.json \
   | jaq --raw-output '..["url"]? | strings' \
   | rg --fixed-strings "wallhaven.cc/w" \
   | gallery-dl --input-file -
-```
+</code></pre>
+
 I exported my current session to json with tab session manager. This command
 takes that json export (referred to as `export.json`), finds all the urls
 that contain `wallhaven.cc/w` (i.e. all urls that are wallhaven images) and
@@ -19,7 +21,9 @@ This workflow could be made better by creating a version of tab session manager
 that exports in a simpler (or more configurable format), and I could also turn
 this into a script that takes the wanted website formats as an argument.
 Invocation of the script might look something like: 
-```zsh
+
+<!-- FIXME: shell highlighting doesn't work yet -->
+<pre><code>
 tabsession-dl --format "wallhaven.cc/w" --format "reddit.com/r" \
   --input-file export.json
-```
+</code></pre>
diff --git a/site/2026-02-20-pleasant-arch-setup.md b/site/2026-02-20-pleasant-arch-setup.md
index 93f35b0..2ba0ab2 100644
--- a/site/2026-02-20-pleasant-arch-setup.md
+++ b/site/2026-02-20-pleasant-arch-setup.md
@@ -26,13 +26,13 @@ I created the `~/.config/environment.d` directory and populated it with a few
 files for different types of assignments. For example here's the file I use to
 set my XDG base directories:
 
-```bash
+<pre><code class="language-conf">
 # ~/.config/environment.d/10-user-dirs.conf
 XDG_CONFIG_HOME=$HOME/.config
 XDG_CACHE_HOME=$HOME/.cache
 XDG_DATA_HOME=$HOME/.local/share
 XDG_STATE_HOME=$HOME/.local/state
-```
+</code></pre>
 
 This approach has a few benefits and a few downsides. It means my variables
 aren't dependent on my shell, that they're located in a common location, and
@@ -55,12 +55,12 @@ offending programs on my system as well as the fix, if any is available.
 Most fixes tend to be environment variables, and as such I have the following
 file in my `environment.d`
 
-```bash
+<pre><code class="language-conf">
 # ~/.config/environment.d/40-xdg-ninja.conf
 CARGO_HOME=$XDG_DATA_HOME/cargo
 RUSTUP_HOME=$XDG_DATA_HOME/rustup
 # ...
-```
+</code></pre>
 
 ## SSH agent
 
@@ -75,10 +75,10 @@ it instead, so long as I set the `SSH_AUTH_SOCK` environment variable manually.
 Therefore an invocation of `systemctl --user enable ssh-agent.service` along
 with creating the following environment file solves my troubles.
 
-```bash
+<pre><code class="language-conf">
 # ~/.config/environment.d/30-ssh-agent.conf
 SSH_AUTH_SOCK=$XDG_RUNTIME_DIR/ssh-agent.socket
-```
+</code></pre>
 
 ## Xwayland
 
@@ -89,7 +89,7 @@ like niri's `spawn-at-startup`. Therefore I dropped this [service
 file](https://github.com/Supreeeme/xwayland-satellite/blob/main/resources/xwayland-satellite.service)
 into my user services.
 
-```ini
+<pre><code class="language-ini">
 # ~/.config/systemd/user/xwayland-satellite.service
 [Unit]
 Description=Xwayland outside your Wayland
@@ -101,23 +101,24 @@ Requisite=graphical-session.target
 [Service]
 Type=notify
 NotifyAccess=all
-ExecStart=/usr/local/bin/xwayland-satellite ; <- this needed adjustment
+ExecStart=/usr/local/bin/xwayland-satellite
+# ^^ this needed adjustment ^^
 StandardOutput=journal
 
 [Install]
 WantedBy=graphical-session.target
-```
+</code></pre>
 
 X based applications also expect the `DISPLAY` environment variable to be set
 so I created put that into my wayland workarounds environment file. That file
 also contains other environment-based hints to programs that they should really
 use wayland pretty-please.
 
-```bash
+<pre><code class="language-conf">
 # ~/.config/environment.d/20-wayland-hints.conf
 DISPLAY=:1
 ELECTRON_OZONE_PLATFORM_HINT=wayland
 _JAVA_AWT_WM_NONREPARENTING=1
-```
+</code></pre>
 
 I'm not sure whether the exact number you choose for the display has any effect.
diff --git a/site/highlight.css b/site/highlight.css
new file mode 100644
index 0000000..fd183cf
--- /dev/null
+++ b/site/highlight.css
@@ -0,0 +1,23 @@
+/* Style definition file generated by highlight 4.18, http://andre-simon.de/ */
+/* highlight theme: Github Source View */
+body.hl	{ background-color:#ffffff; }
+pre.hl	{ color:#000000; background-color:#ffffff; font-size:10pt; font-family:'Courier New',monospace; white-space: pre-wrap; }
+.hl.num { color:#0086b3; }
+.hl.esc { color:#183691; }
+.hl.sng { color:#183691; }
+.hl.pps { color:#183691; }
+.hl.slc { color:#969896; }
+.hl.com { color:#969896; }
+.hl.ppc { color:#a71d5d; }
+.hl.opt { color:#000000; }
+.hl.ipl { color:#183691; }
+.hl.lin { color:#b2b2b2; user-select: none;-webkit-user-select: none; }
+.hl.hvr { cursor:help; }
+.hl.erm { color:#ff0000; font-weight:bold; border:solid 1px red; margin-left: 3em; }
+.hl.err { color:#ff0000; font-weight:bold; }
+.hl.kwa { color:#a71d5d; }
+.hl.kwb { color:#0086b3; }
+.hl.kwc { color:#0086b3; }
+.hl.kwd { color:#0086b3; }
+.hl.kwe { color:#a71d5d; }
+.hl.kwf { color:#38ae50; }
diff --git a/soupault.toml b/soupault.toml
index 415470d..dacd145 100644
--- a/soupault.toml
+++ b/soupault.toml
@@ -52,6 +52,17 @@
   selector = 'head'
   html = """ <link rel="stylesheet" href="/sakura.css" type="text/css"> """
 
+[widgets.insert-highlight-css]
+  widget = 'insert_html'
+  selector = 'head'
+  html = """ <link rel="stylesheet" href="/highlight.css" type="text/css"> """
+
+[widgets.highlight]
+  # after = 'escape-html-in-pre'
+  widget = 'preprocess_element'
+  selector = '*[class^="language-"]'
+  command = 'highlight -O html -f --syntax=$(echo $ATTR_CLASS | sed "s/language-//")'
+
 
 [index]
   sort_descending = true