feat: remove tailwind

package-lock.json

@@ -15,11 +15,7 @@
         "@11ty/eleventy-img": "^3.1.8",
         "@11ty/eleventy-plugin-rss": "^1.2.0",
         "@11ty/eleventy-plugin-syntaxhighlight": "^5.0.0",
-        "@catppuccin/tailwindcss": "^0.1.6",
         "@rknightuk/eleventy-plugin-post-graph": "^1.0.4",
-        "@tailwindcss/aspect-ratio": "^0.4.2",
-        "@tailwindcss/line-clamp": "^0.4.4",
-        "@tailwindcss/typography": "^0.5.10",
         "autoprefixer": "^10.4.16",
         "child_process": "^1.0.2",
         "clean-css": "^5.3.3",
@@ -42,8 +38,6 @@
         "sanitize-html": "^2.11.0",
         "slugify": "^1.6.6",
         "striptags": "^3.2.0",
-        "tailwind-scrollbar": "^3.0.5",
-        "tailwindcss": "^3.4.0",
         "writing-stats": "^1.0.6"
       }
     },
@@ -281,18 +275,6 @@
         "url": "https://opencollective.com/11ty"
       }
     },
-    "node_modules/@alloc/quick-lru": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/@alloc/quick-lru/-/quick-lru-5.2.0.tgz",
-      "integrity": "sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==",
-      "dev": true,
-      "engines": {
-        "node": ">=10"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/sindresorhus"
-      }
-    },
     "node_modules/@babel/helper-string-parser": {
       "version": "7.23.4",
       "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.23.4.tgz",
@@ -337,15 +319,6 @@
         "node": ">=6.9.0"
       }
     },
-    "node_modules/@catppuccin/tailwindcss": {
-      "version": "0.1.6",
-      "resolved": "https://registry.npmjs.org/@catppuccin/tailwindcss/-/tailwindcss-0.1.6.tgz",
-      "integrity": "sha512-V+Y0AwZ5SSyvOVAcDl7Ng30xy+m82OKnEJ+9+kcZZ7lRyXuZrAb2GScdq9XR3v+ggt8qiZ/G4TvaC9cJ88AAXA==",
-      "dev": true,
-      "peerDependencies": {
-        "tailwindcss": ">=3.0.0"
-      }
-    },
     "node_modules/@iarna/toml": {
       "version": "2.2.5",
       "resolved": "https://registry.npmjs.org/@iarna/toml/-/toml-2.2.5.tgz",
@@ -910,39 +883,6 @@
       "integrity": "sha512-+9jVqKhRSpsc591z5vX+X5Yyw+he/HCB4iQ/RYxw35CEPaY1gnsNE43nf9n9AaYjAQrTiI/mOwKUKdUs9vf7Xg==",
       "dev": true
     },
-    "node_modules/@tailwindcss/aspect-ratio": {
-      "version": "0.4.2",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/aspect-ratio/-/aspect-ratio-0.4.2.tgz",
-      "integrity": "sha512-8QPrypskfBa7QIMuKHg2TA7BqES6vhBrDLOv8Unb6FcFyd3TjKbc6lcmb9UPQHxfl24sXoJ41ux/H7qQQvfaSQ==",
-      "dev": true,
-      "peerDependencies": {
-        "tailwindcss": ">=2.0.0 || >=3.0.0 || >=3.0.0-alpha.1"
-      }
-    },
-    "node_modules/@tailwindcss/line-clamp": {
-      "version": "0.4.4",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/line-clamp/-/line-clamp-0.4.4.tgz",
-      "integrity": "sha512-5U6SY5z8N42VtrCrKlsTAA35gy2VSyYtHWCsg1H87NU1SXnEfekTVlrga9fzUDrrHcGi2Lb5KenUWb4lRQT5/g==",
-      "dev": true,
-      "peerDependencies": {
-        "tailwindcss": ">=2.0.0 || >=3.0.0 || >=3.0.0-alpha.1"
-      }
-    },
-    "node_modules/@tailwindcss/typography": {
-      "version": "0.5.10",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/typography/-/typography-0.5.10.tgz",
-      "integrity": "sha512-Pe8BuPJQJd3FfRnm6H0ulKIGoMEQS+Vq01R6M5aCrFB/ccR/shT+0kXLjouGC1gFLm9hopTFN+DMP0pfwRWzPw==",
-      "dev": true,
-      "dependencies": {
-        "lodash.castarray": "^4.4.0",
-        "lodash.isplainobject": "^4.0.6",
-        "lodash.merge": "^4.6.2",
-        "postcss-selector-parser": "6.0.10"
-      },
-      "peerDependencies": {
-        "tailwindcss": ">=3.0.0 || insiders"
-      }
-    },
     "node_modules/@types/cookie": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/@types/cookie/-/cookie-0.4.1.tgz",
@@ -1102,12 +1042,6 @@
         "node": ">= 8"
       }
     },
-    "node_modules/arg": {
-      "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/arg/-/arg-5.0.2.tgz",
-      "integrity": "sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==",
-      "dev": true
-    },
     "node_modules/argparse": {
       "version": "1.0.10",
       "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
@@ -1562,15 +1496,6 @@
         "tslib": "^2.0.3"
       }
     },
-    "node_modules/camelcase-css": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/camelcase-css/-/camelcase-css-2.0.1.tgz",
-      "integrity": "sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==",
-      "dev": true,
-      "engines": {
-        "node": ">= 6"
-      }
-    },
     "node_modules/caniuse-lite": {
       "version": "1.0.30001571",
       "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001571.tgz",
@@ -2003,18 +1928,6 @@
         "node": ">= 8"
       }
     },
-    "node_modules/cssesc": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
-      "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
-      "dev": true,
-      "bin": {
-        "cssesc": "bin/cssesc"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
     "node_modules/cssstyle": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-3.0.0.tgz",
@@ -2164,18 +2077,6 @@
         "node": ">= 0.8.0"
       }
     },
-    "node_modules/didyoumean": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/didyoumean/-/didyoumean-1.2.2.tgz",
-      "integrity": "sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==",
-      "dev": true
-    },
-    "node_modules/dlv": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/dlv/-/dlv-1.1.3.tgz",
-      "integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==",
-      "dev": true
-    },
     "node_modules/doctypes": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/doctypes/-/doctypes-1.1.0.tgz",
@@ -3881,15 +3782,6 @@
         "node": "*"
       }
     },
-    "node_modules/jiti": {
-      "version": "1.21.0",
-      "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.0.tgz",
-      "integrity": "sha512-gFqAIbuKyyso/3G2qhiO2OM6shY6EPP/R0+mkDbyspxKazh8BXDC5FiFsUjlczgdNz/vfra0da2y+aHrusLG/Q==",
-      "dev": true,
-      "bin": {
-        "jiti": "bin/jiti.js"
-      }
-    },
     "node_modules/js-beautify": {
       "version": "1.14.11",
       "resolved": "https://registry.npmjs.org/js-beautify/-/js-beautify-1.14.11.tgz",
@@ -4036,27 +3928,12 @@
         "node": ">=6"
       }
     },
-    "node_modules/lilconfig": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-2.1.0.tgz",
-      "integrity": "sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==",
-      "dev": true,
-      "engines": {
-        "node": ">=10"
-      }
-    },
     "node_modules/limiter": {
       "version": "1.1.5",
       "resolved": "https://registry.npmjs.org/limiter/-/limiter-1.1.5.tgz",
       "integrity": "sha512-FWWMIEOxz3GwUI4Ts/IvgVy6LPvoMPgjMdQ185nN6psJyBJ4yOpzqm695/h5umdLJg2vW3GR5iG11MAkR2AzJA==",
       "dev": true
     },
-    "node_modules/lines-and-columns": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
-      "integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==",
-      "dev": true
-    },
     "node_modules/linkify-it": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-5.0.0.tgz",
@@ -4250,12 +4127,6 @@
       "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
       "dev": true
     },
-    "node_modules/lodash.castarray": {
-      "version": "4.4.0",
-      "resolved": "https://registry.npmjs.org/lodash.castarray/-/lodash.castarray-4.4.0.tgz",
-      "integrity": "sha512-aVx8ztPv7/2ULbArGJ2Y42bG1mEQ5mGjpdvrbJcJFU3TbYybe+QlLS4pst9zV52ymy2in1KpFPiZnAOATxD4+Q==",
-      "dev": true
-    },
     "node_modules/lodash.deburr": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/lodash.deburr/-/lodash.deburr-4.1.0.tgz",
@@ -4268,18 +4139,6 @@
       "integrity": "sha512-7FGG40uhC8Mm633uKW1r58aElFlBlxCrg9JfSi3P6aYiWmfiWF0PgMd86ZUsxE5GwWPdHoS2+48bwTh2VPkIQA==",
       "dev": true
     },
-    "node_modules/lodash.isplainobject": {
-      "version": "4.0.6",
-      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
-      "integrity": "sha512-oSXzaWypCMHkPC3NvBEaPHf0KsA5mvPrOPgQWDsbg8n7orZ290M0BmC/jgRZ4vcJ6DTAhjrsSYgdsW/F+MFOBA==",
-      "dev": true
-    },
-    "node_modules/lodash.merge": {
-      "version": "4.6.2",
-      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
-      "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
-      "dev": true
-    },
     "node_modules/lower-case": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/lower-case/-/lower-case-2.0.2.tgz",
@@ -4729,23 +4588,6 @@
         "mustache": "bin/mustache"
       }
     },
-    "node_modules/mz": {
-      "version": "2.7.0",
-      "resolved": "https://registry.npmjs.org/mz/-/mz-2.7.0.tgz",
-      "integrity": "sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==",
-      "dev": true,
-      "dependencies": {
-        "any-promise": "^1.0.0",
-        "object-assign": "^4.0.1",
-        "thenify-all": "^1.0.0"
-      }
-    },
-    "node_modules/mz/node_modules/any-promise": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz",
-      "integrity": "sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==",
-      "dev": true
-    },
     "node_modules/nanoid": {
       "version": "3.3.7",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.7.tgz",
@@ -4954,15 +4796,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/object-hash": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/object-hash/-/object-hash-3.0.0.tgz",
-      "integrity": "sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==",
-      "dev": true,
-      "engines": {
-        "node": ">= 6"
-      }
-    },
     "node_modules/on-finished": {
       "version": "2.4.1",
       "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.4.1.tgz",
@@ -5181,15 +5014,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/pirates": {
-      "version": "4.0.6",
-      "resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.6.tgz",
-      "integrity": "sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==",
-      "dev": true,
-      "engines": {
-        "node": ">= 6"
-      }
-    },
     "node_modules/please-upgrade-node": {
       "version": "3.2.0",
       "resolved": "https://registry.npmjs.org/please-upgrade-node/-/please-upgrade-node-3.2.0.tgz",
@@ -5250,131 +5074,6 @@
         "node": "^10 || ^12 || >=14"
       }
     },
-    "node_modules/postcss-import": {
-      "version": "15.1.0",
-      "resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-15.1.0.tgz",
-      "integrity": "sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==",
-      "dev": true,
-      "dependencies": {
-        "postcss-value-parser": "^4.0.0",
-        "read-cache": "^1.0.0",
-        "resolve": "^1.1.7"
-      },
-      "engines": {
-        "node": ">=14.0.0"
-      },
-      "peerDependencies": {
-        "postcss": "^8.0.0"
-      }
-    },
-    "node_modules/postcss-js": {
-      "version": "4.0.1",
-      "resolved": "https://registry.npmjs.org/postcss-js/-/postcss-js-4.0.1.tgz",
-      "integrity": "sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==",
-      "dev": true,
-      "dependencies": {
-        "camelcase-css": "^2.0.1"
-      },
-      "engines": {
-        "node": "^12 || ^14 || >= 16"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/postcss/"
-      },
-      "peerDependencies": {
-        "postcss": "^8.4.21"
-      }
-    },
-    "node_modules/postcss-load-config": {
-      "version": "4.0.2",
-      "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-4.0.2.tgz",
-      "integrity": "sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==",
-      "dev": true,
-      "funding": [
-        {
-          "type": "opencollective",
-          "url": "https://opencollective.com/postcss/"
-        },
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/ai"
-        }
-      ],
-      "dependencies": {
-        "lilconfig": "^3.0.0",
-        "yaml": "^2.3.4"
-      },
-      "engines": {
-        "node": ">= 14"
-      },
-      "peerDependencies": {
-        "postcss": ">=8.0.9",
-        "ts-node": ">=9.0.0"
-      },
-      "peerDependenciesMeta": {
-        "postcss": {
-          "optional": true
-        },
-        "ts-node": {
-          "optional": true
-        }
-      }
-    },
-    "node_modules/postcss-load-config/node_modules/lilconfig": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-3.0.0.tgz",
-      "integrity": "sha512-K2U4W2Ff5ibV7j7ydLr+zLAkIg5JJ4lPn1Ltsdt+Tz/IjQ8buJ55pZAxoP34lqIiwtF9iAvtLv3JGv7CAyAg+g==",
-      "dev": true,
-      "engines": {
-        "node": ">=14"
-      }
-    },
-    "node_modules/postcss-nested": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-6.0.1.tgz",
-      "integrity": "sha512-mEp4xPMi5bSWiMbsgoPfcP74lsWLHkQbZc3sY+jWYd65CUwXrUaTp0fmNpa01ZcETKlIgUdFN/MpS2xZtqL9dQ==",
-      "dev": true,
-      "dependencies": {
-        "postcss-selector-parser": "^6.0.11"
-      },
-      "engines": {
-        "node": ">=12.0"
-      },
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/postcss/"
-      },
-      "peerDependencies": {
-        "postcss": "^8.2.14"
-      }
-    },
-    "node_modules/postcss-nested/node_modules/postcss-selector-parser": {
-      "version": "6.0.13",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.13.tgz",
-      "integrity": "sha512-EaV1Gl4mUEV4ddhDnv/xtj7sxwrwxdetHdWUGnT4VJQf+4d05v6lHYZr8N573k5Z0BViss7BDhfWtKS3+sfAqQ==",
-      "dev": true,
-      "dependencies": {
-        "cssesc": "^3.0.0",
-        "util-deprecate": "^1.0.2"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
-    "node_modules/postcss-selector-parser": {
-      "version": "6.0.10",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.10.tgz",
-      "integrity": "sha512-IQ7TZdoaqbT+LCpShg46jnZVlhWD2w6iQYAcYXfHARZ7X1t/UGhhceQDs5X0cGqKvYlHNOuv7Oa1xmb0oQuA3w==",
-      "dev": true,
-      "dependencies": {
-        "cssesc": "^3.0.0",
-        "util-deprecate": "^1.0.2"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
     "node_modules/postcss-value-parser": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
@@ -5805,15 +5504,6 @@
         "node": ">=0.10.0"
       }
     },
-    "node_modules/read-cache": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
-      "integrity": "sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==",
-      "dev": true,
-      "dependencies": {
-        "pify": "^2.3.0"
-      }
-    },
     "node_modules/readable-stream": {
       "version": "3.6.2",
       "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.2.tgz",
@@ -6957,79 +6647,6 @@
       "integrity": "sha512-J8bbNyKKXl5qYcR36TIO8W3mVGVHrmmxsd5PAItGkmyzwJvybiw2IVq5nqd0i4LSNSkB/sx9VHllbfFdr9k1JA==",
       "dev": true
     },
-    "node_modules/sucrase": {
-      "version": "3.34.0",
-      "resolved": "https://registry.npmjs.org/sucrase/-/sucrase-3.34.0.tgz",
-      "integrity": "sha512-70/LQEZ07TEcxiU2dz51FKaE6hCTWC6vr7FOk3Gr0U60C3shtAN+H+BFr9XlYe5xqf3RA8nrc+VIwzCfnxuXJw==",
-      "dev": true,
-      "dependencies": {
-        "@jridgewell/gen-mapping": "^0.3.2",
-        "commander": "^4.0.0",
-        "glob": "7.1.6",
-        "lines-and-columns": "^1.1.6",
-        "mz": "^2.7.0",
-        "pirates": "^4.0.1",
-        "ts-interface-checker": "^0.1.9"
-      },
-      "bin": {
-        "sucrase": "bin/sucrase",
-        "sucrase-node": "bin/sucrase-node"
-      },
-      "engines": {
-        "node": ">=8"
-      }
-    },
-    "node_modules/sucrase/node_modules/brace-expansion": {
-      "version": "1.1.11",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
-      "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
-      "dev": true,
-      "dependencies": {
-        "balanced-match": "^1.0.0",
-        "concat-map": "0.0.1"
-      }
-    },
-    "node_modules/sucrase/node_modules/commander": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz",
-      "integrity": "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==",
-      "dev": true,
-      "engines": {
-        "node": ">= 6"
-      }
-    },
-    "node_modules/sucrase/node_modules/glob": {
-      "version": "7.1.6",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.6.tgz",
-      "integrity": "sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA==",
-      "dev": true,
-      "dependencies": {
-        "fs.realpath": "^1.0.0",
-        "inflight": "^1.0.4",
-        "inherits": "2",
-        "minimatch": "^3.0.4",
-        "once": "^1.3.0",
-        "path-is-absolute": "^1.0.0"
-      },
-      "engines": {
-        "node": "*"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/sucrase/node_modules/minimatch": {
-      "version": "3.1.2",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
-      "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
-      "dev": true,
-      "dependencies": {
-        "brace-expansion": "^1.1.7"
-      },
-      "engines": {
-        "node": "*"
-      }
-    },
     "node_modules/supports-color": {
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -7060,80 +6677,6 @@
       "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==",
       "dev": true
     },
-    "node_modules/tailwind-scrollbar": {
-      "version": "3.0.5",
-      "resolved": "https://registry.npmjs.org/tailwind-scrollbar/-/tailwind-scrollbar-3.0.5.tgz",
-      "integrity": "sha512-0ZwxTivevqq9BY9fRP9zDjHl7Tu+J5giBGbln+0O1R/7nHtBUKnjQcA1aTIhK7Oyjp6Uc/Dj6/dn8Dq58k5Uww==",
-      "dev": true,
-      "engines": {
-        "node": ">=12.13.0"
-      },
-      "peerDependencies": {
-        "tailwindcss": "3.x"
-      }
-    },
-    "node_modules/tailwindcss": {
-      "version": "3.4.0",
-      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.0.tgz",
-      "integrity": "sha512-VigzymniH77knD1dryXbyxR+ePHihHociZbXnLZHUyzf2MMs2ZVqlUrZ3FvpXP8pno9JzmILt1sZPD19M3IxtA==",
-      "dev": true,
-      "dependencies": {
-        "@alloc/quick-lru": "^5.2.0",
-        "arg": "^5.0.2",
-        "chokidar": "^3.5.3",
-        "didyoumean": "^1.2.2",
-        "dlv": "^1.1.3",
-        "fast-glob": "^3.3.0",
-        "glob-parent": "^6.0.2",
-        "is-glob": "^4.0.3",
-        "jiti": "^1.19.1",
-        "lilconfig": "^2.1.0",
-        "micromatch": "^4.0.5",
-        "normalize-path": "^3.0.0",
-        "object-hash": "^3.0.0",
-        "picocolors": "^1.0.0",
-        "postcss": "^8.4.23",
-        "postcss-import": "^15.1.0",
-        "postcss-js": "^4.0.1",
-        "postcss-load-config": "^4.0.1",
-        "postcss-nested": "^6.0.1",
-        "postcss-selector-parser": "^6.0.11",
-        "resolve": "^1.22.2",
-        "sucrase": "^3.32.0"
-      },
-      "bin": {
-        "tailwind": "lib/cli.js",
-        "tailwindcss": "lib/cli.js"
-      },
-      "engines": {
-        "node": ">=14.0.0"
-      }
-    },
-    "node_modules/tailwindcss/node_modules/glob-parent": {
-      "version": "6.0.2",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
-      "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==",
-      "dev": true,
-      "dependencies": {
-        "is-glob": "^4.0.3"
-      },
-      "engines": {
-        "node": ">=10.13.0"
-      }
-    },
-    "node_modules/tailwindcss/node_modules/postcss-selector-parser": {
-      "version": "6.0.13",
-      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.13.tgz",
-      "integrity": "sha512-EaV1Gl4mUEV4ddhDnv/xtj7sxwrwxdetHdWUGnT4VJQf+4d05v6lHYZr8N573k5Z0BViss7BDhfWtKS3+sfAqQ==",
-      "dev": true,
-      "dependencies": {
-        "cssesc": "^3.0.0",
-        "util-deprecate": "^1.0.2"
-      },
-      "engines": {
-        "node": ">=4"
-      }
-    },
     "node_modules/tar-fs": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.0.4.tgz",
@@ -7180,33 +6723,6 @@
       "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
       "dev": true
     },
-    "node_modules/thenify": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/thenify/-/thenify-3.3.1.tgz",
-      "integrity": "sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==",
-      "dev": true,
-      "dependencies": {
-        "any-promise": "^1.0.0"
-      }
-    },
-    "node_modules/thenify-all": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/thenify-all/-/thenify-all-1.6.0.tgz",
-      "integrity": "sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==",
-      "dev": true,
-      "dependencies": {
-        "thenify": ">= 3.1.0 < 4"
-      },
-      "engines": {
-        "node": ">=0.8"
-      }
-    },
-    "node_modules/thenify/node_modules/any-promise": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz",
-      "integrity": "sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==",
-      "dev": true
-    },
     "node_modules/to-fast-properties": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz",
@@ -7270,12 +6786,6 @@
         "node": ">=18"
       }
     },
-    "node_modules/ts-interface-checker": {
-      "version": "0.1.13",
-      "resolved": "https://registry.npmjs.org/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz",
-      "integrity": "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==",
-      "dev": true
-    },
     "node_modules/tslib": {
       "version": "2.6.2",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.6.2.tgz",
@@ -7687,15 +7197,6 @@
       "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
       "dev": true
     },
-    "node_modules/yaml": {
-      "version": "2.3.4",
-      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.3.4.tgz",
-      "integrity": "sha512-8aAvwVUSHpfEqTQ4w/KMlf3HcRdt50E5ODIQJBw1fQ5RL34xabzxtUlzTXVqc4rkZsPbvrXKWnABCD7kWSmocA==",
-      "dev": true,
-      "engines": {
-        "node": ">= 14"
-      }
-    },
     "node_modules/yargs": {
       "version": "17.7.2",
       "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",

package.json

@@ -1,14 +1,14 @@
 {
   "name": "coryd.dev",
-  "version": "3.0.2",
+  "version": "4.0.0",
   "description": "The source for my personal site, blog and portfolio. Built using 11ty and hosted on Netlify.",
   "type": "module",
   "scripts": {
-    "start": "ELEVENTY_PRODUCTION=false eleventy --serve && NODE_ENV=development npx tailwindcss -i ./tailwind.css -o src/assets/styles/tailwind.css && rm -rf .cache",
+    "start": "ELEVENTY_PRODUCTION=false eleventy --serve",
-    "debug": "DEBUG=Eleventy* npx @11ty/eleventy --serve && NODE_ENV=development npx tailwindcss -i ./tailwind.css -o src/styles/tailwind.css",
+    "debug": "DEBUG=Eleventy* npx @11ty/eleventy --serve",
     "lint": "eslint .",
     "lint:fix": "eslint . --fix",
-    "build": "ELEVENTY_PRODUCTION=true eleventy && NODE_ENV=production npx tailwindcss -i ./tailwind.css -c ./tailwind.config.js -o src/styles/tailwind.css --minify"
+    "build": "ELEVENTY_PRODUCTION=true eleventy"
   },
   "keywords": [
     "11ty",
@@ -23,11 +23,7 @@
     "@11ty/eleventy-img": "^3.1.8",
     "@11ty/eleventy-plugin-rss": "^1.2.0",
     "@11ty/eleventy-plugin-syntaxhighlight": "^5.0.0",
-    "@catppuccin/tailwindcss": "^0.1.6",
     "@rknightuk/eleventy-plugin-post-graph": "^1.0.4",
-    "@tailwindcss/aspect-ratio": "^0.4.2",
-    "@tailwindcss/line-clamp": "^0.4.4",
-    "@tailwindcss/typography": "^0.5.10",
     "autoprefixer": "^10.4.16",
     "child_process": "^1.0.2",
     "clean-css": "^5.3.3",
@@ -50,8 +46,6 @@
     "sanitize-html": "^2.11.0",
     "slugify": "^1.6.6",
     "striptags": "^3.2.0",
-    "tailwind-scrollbar": "^3.0.5",
-    "tailwindcss": "^3.4.0",
     "writing-stats": "^1.0.6"
   }
 }

src/_includes/base.liquid

@@ -1,6 +1,6 @@
 {%- capture fullUrl %}{{ meta.url }}{{ page.url }}{% endcapture -%}
 <!doctype html>
-<html class="scrollbar-thin scrollbar-thumb-blue-600 dark:scrollbar-thumb-blue-400 scrollbar-track-blue-100" lang="en">
+<html lang="en">
   <head>
     <title>{%- if title %}{{ title }} • {% endif -%}{{ meta.siteName }}</title>
     <meta charset="utf-8">
@@ -31,9 +31,11 @@
       type="image/svg+xml">
     <link href="/assets/icons/apple-touch-icon.png?v={% assetHash %}" rel="apple-touch-icon">
     {% capture css %}
-      {% render "../assets/styles/prism.css" %}
+      {% render "../assets/styles/ml.css" %}
       {% render "../assets/styles/silka.css" %}
-      {% render "../assets/styles/tailwind.css" %}
+      {% render "../assets/styles/yt-lite.css" %}
+      {% render "../assets/styles/prism.css" %}
+      {% render "../assets/styles/index.css" %}
     {% endcapture %}
     <style>
       {{ css | cssmin }}
@@ -110,7 +112,7 @@
       </style>
     </noscript>
   </head>
-  <body class="dark:text-white bg-white dark:bg-gray-900 font-sans text-gray-800 scrollbar-thin scrollbar-thumb-blue-600 dark:scrollbar-thumb-blue-400 scrollbar-track-blue-100">
+  <body>
     {{ content }}
     {% capture js %}
       {% render "../assets/scripts/script.js" %}

src/_includes/default.liquid

@@ -2,6 +2,6 @@
 layout: main
 ---
 {% render "partials/header.liquid", meta: meta, page: page, nav: nav %}
-<div class="pt-8 prose dark:prose-invert hover:prose-a:text-blue-800 dark:hover:prose-a:text-blue-200 max-w-full">
+<div class="default__wrapper">
   {{ content }}
 </div>

src/_includes/main.liquid

@@ -1,8 +1,8 @@
 ---
 layout: base
 ---
-<div class="min-h-screen flex flex-col">
+<div class="main__wrapper">
-  <main class="flex-1 w-10/12 max-w-screen-sm md:max-w-screen-md mx-auto">
+  <main>
     {{ content }}
   </main>
   {% render "partials/footer.liquid", page: page, nav: nav %}

src/_includes/now.liquid

@@ -10,6 +10,8 @@ layout: main
 {% render "partials/now/links.liquid", links:links %}
 {% render "partials/now/media-grid.liquid", data:movies, icon: "movie", title: "Movies", shape: "vertical", count: 6 %}
 {% render "partials/now/media-grid.liquid", data:tv, icon: "device-tv", title: "TV", shape: "vertical", count: 6 %}
-<p class="text-xs text-center pt-6">This is a
+<p class="now__explainer text-center">
+  This is a
   <a href="https://nownownow.com/about">now page</a>, and if you have your own site,
-  <a href="https://nownownow.com/about">you should make one too</a>.</p>
+  <a href="https://nownownow.com/about">you should make one too</a>.
+</p>

src/_includes/partials/author.liquid

@@ -1,9 +1,9 @@
-<div class="mt-12 pt-12 pb-8 border-t border-gray-200 dark:border-gray-700 flex flex-col md:flex-row justify-between items-center">
+<div class="author__wrapper">
-  <div class="flex flex-col mb-4 md:mb-0 md:flex-row items-center flex-1">
+  <div class="avatar__wrapper">
-    <div class="border border-blue-600 dark:border-blue-400 bg-white rounded-full overflow-hidden mb-4 md:mb-0 md:mr-4 [&>*]:h-20 [&>*]:w-20 flex flex-col items-center">
+    <div class="avatar__wrapper--interior">
-      {% image './src/assets/img/avatar.webp', meta.siteName, 'inline-block' %}
+      {% image './src/assets/img/avatar.webp', meta.siteName, 'author-avatar' %}
     </div>
-    <span class="text-lg font-medium">{{ meta.siteName }}</span>
+    <span>{{ meta.siteName }}</span>
   </div>
-  <p class="text-sm flex-1">{{ meta.siteDescription }}</p>
+  <p class="description__wrapper">{{ meta.siteDescription }}</p>
 </div>

src/_includes/partials/footer.liquid

@@ -1,13 +1,13 @@
 <footer>
-  <div class="mt-8 pt-8 pb-4 flex gap-2 md:gap-3 justify-center w-full">
+  <nav class="social__main">
     {% for link in nav.social %}
       {% render "partials/nav/linked-icon.liquid", name: link.name, link: link.url, icon: link.icon %}
     {% endfor %}
-  </div>
+  </nav>
-  <div class="flex justify-center text-sm text-gray-500 dark:text-gray-100 pb-8 text-center">
+  <nav class="links__secondary">
     {% for link in nav.footer %}
       {% render "partials/nav/link.liquid", page: page, link: link.name, icon: link.icon %}
-      {% if not forloop.last %}<span class="mx-1">•</span>{% endif %}
+      {% if not forloop.last %}<span>•</span>{% endif %}
     {% endfor %}
-  </div>
+  </nav>
 </footer>

src/_includes/partials/header.liquid

@@ -1,6 +1,6 @@
-<div class="flex flex-col md:flex-row md:items-center md:justify-between pt-5 md:pt-10">
+<div class="main__title">
-  <h1 class="text-2xl md:text-3xl font-black leading-tight pb-5 md:pb-0">
+  <h1>
-    <a class="text-gray-700 dark:text-white" href="/">{{ meta.siteName }}</a>
+    <a href="/">{{ meta.siteName }}</a>
   </h1>
   {% render "partials/nav/menu.liquid", page: page, nav: nav %}
 </div>

src/_includes/partials/nav/link.liquid

@@ -1,6 +1,6 @@
 {%- capture pageUrl %}/{{ link | downcase }}/{% endcapture -%}
 {% if pageUrl contains page.fileSlug and page.fileSlug %}
-  <span class="cursor-not-allowed active">
+  <span class="active">
     {% if icon %}
       {% tablericon icon link %}
     {% else %}
@@ -8,11 +8,13 @@
     {% endif %}
   </span>
 {% else %}
-  <a class="text-gray-700 hover:text-blue-800 dark:text-white dark:hover:text-blue-200 !no-underline" href="/{{ link | downcase }}">
+  {% if icon %}
-    {% if icon %}
+    <a class="link--icon" href="/{{ link | downcase }}">
       {% tablericon icon link %}
-    {% else %}
+    </a>
+  {% else %}
+    <a href="/{{ link | downcase }}">
       {{ link }}
-    {% endif %}
+    </a>
-  </a>
+  {% endif %}
 {% endif %}

src/_includes/partials/nav/linked-icon.liquid

@@ -1,5 +1,5 @@
 <a
-  class="[&>svg]:h-6 [&>svg]:w-6 link--icon"
+  class="link--icon"
   href="{{ link }}"
   rel="me"
   title="{{ name }}">

src/_includes/partials/nav/menu.liquid

@@ -1,7 +1,7 @@
 <nav>
-  <ul class="flex">
+  <ul>
     {% for link in nav.menu %}
-      <li{% if not forloop.last %} class="mr-4"{% endif %}>
+      <li>
         {% render "partials/nav/link.liquid", page: page, link: link.name, icon: link.icon %}
       </li>
     {% endfor %}

src/_includes/partials/now/albumReleases.liquid

@@ -1,12 +1,12 @@
 {% if albumReleases.size > 0 %}
-  <h2 class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:md:h-7 [&>svg]:md:w-7 [&>svg]:-mt-1 [&>svg]:md:-mt-1.5 [&>svg]:inline icon--bold m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mt-8 mb-4">
+  <h2 class="now__section--header">
     {% tablericon "calendar-time" "Anticipated albums" %}
     Anticipated albums
   </h2>
-  <ul class="list-inside list-disc pl-5 md:pl-10">
+  <ul>
     {% for album in albumReleases %}
-      <li class="mt-1.5 mb-2">
+      <li>
-        <span class="font-bold">{{ album.date | readableDate }}: </span>
+        <strong>{{ album.date | readableDate }}: </strong>
         <a href="https://{{album.url}}" title="{{album.title | escape}}">
           {{album.title}}
         </a>

src/_includes/partials/now/links.liquid

@@ -1,11 +1,11 @@
 {% if links.size > 0 %}
-  <h2 class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:md:h-7 [&>svg]:md:w-7 [&>svg]:-mt-1 [&>svg]:md:-mt-1.5 [&>svg]:inline icon--bold m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mt-8 mb-4">
+  <h2 class="now__section--header">
     {% tablericon "link" "Links" %}
     Links
   </h2>
-  <ul class="list-inside list-disc pl-5 md:pl-10">
+  <ul>
     {% for link in links limit: 5 %}
-      <li class="mt-1.5 mb-2">
+      <li>
         <a href="{{link.url}}" title="{{link.title | escape}}">
           {{ link.title }}
         </a>

src/_includes/partials/now/media-grid.liquid

@@ -1,36 +1,36 @@
 {% if data.size > 0 %}
   {% assign media = data | normalizeMedia %}
-  <h2 class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:md:h-7 [&>svg]:md:w-7 [&>svg]:-mt-1 [&>svg]:md:-mt-1.5 [&>svg]:inline icon--bold m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mt-8 mb-4">
+  <h2 class="now__section--header">
     {% tablericon icon title %}
     {{ title }}
   </h2>
-  <div class="grid gap-2 {% if shape == 'square' %}grid-cols-2 md:grid-cols-4{% else %}grid-cols-3 md:grid-cols-6{% endif %} not-prose">
+  <div class="media__grid {% if shape == 'square' %}square{% else %}vertical{% endif %}">
     {% for item in media limit: count %}
       {% assign alt = item.alt | strip %}
       <a href="{{ item.url | stripUtm }}" title="{{ alt | escape }}">
-        <div class="relative block h-full rounded-lg overflow-hidden"{% if shape != 'square' %} style="max-width:226px"{% endif %}>
+        <div class="item__wrapper"{% if shape != 'square' %} style="max-width:226px"{% endif %}>
-          <div class="absolute left-0 top-0 h-full w-full rounded-lg border border-blue-600 hover:border-blue-800 dark:border-blue-400 dark:hover:border-blue-200 ease-in-out duration-300{% if item.subtext %} bg-cover-gradient{% endif %}"></div>
+          <div class="item__cover{% if item.subtext %} gradient{% endif %}"></div>
-          <div class="absolute px-1.5 bottom-2 drop-shadow-md w-full">
+          <div class="item__meta-text">
             {% if item.title %}
-              <div class="text-xs font-bold text-white line-clamp-2">{{ item.title }}</div>
+              <div class="header">{{ item.title }}</div>
             {% endif %}
             {% if item.percentage %}
               {% render "partials/now/progress-bar.liquid", percentage:item.percentage %}
             {% endif %}
             {% if item.subtext %}
-              <div class="text-xs text-white line-clamp-2">
+              <div class="subheader">
                 {{ item.subtext }}
               </div>
             {% endif %}
           </div>
-          {%- capture loadingStrategy %}
+          {%- capture loadingStrategy -%}
-            {% if loading %}
+            {%- if loading -%}
               {{ loading }}
-            {% else %}
+            {%- else -%}
               'lazy'
-            {% endif %}
+            {%- endif -%}
-          {% endcapture -%}
+          {%- endcapture -%}
-          {% image item.image, alt, 'rounded-lg w-full h-full [&>*]:w-full [&>*]:h-full', loadingStrategy %}
+          {% image item.image, alt, 'item__image', loadingStrategy %}
         </div>
       </a>
     {% endfor %}

src/_includes/partials/now/playing.liquid

@@ -1,4 +1,4 @@
-<p id="now-playing" class="client-side mb-0 flex flex-row items-start md:items-center">
+<p id="now-playing" class="now-playing client-side">
   <span id="now-playing-loading" class="icon--spin">
     {% tablericon 'loader-2' 'Loading...' %}
   </span>

src/_includes/partials/now/progress-bar.liquid

@@ -1,5 +1,5 @@
 {% if percentage %}
-<div class="overflow-hidden h-4 my-1 w-full flex rounded-lg bg-gray-200/60">
+<div class="progress-bar__wrapper">
-  <div style="width:{{ percentage }}" class="shadow-none flex flex-col whitespace-nowrap justify-center bg-blue-600 dark:bg-blue-400"></div>
+  <div style="width:{{ percentage }}" class="progress-bar shadow-none flex flex-col whitespace-nowrap justify-center bg-blue-600 dark:bg-blue-400"></div>
 </div>
 {% endif %}

src/_includes/partials/now/topper.liquid

@@ -1,8 +1,6 @@
-<div class="border-b border-gray-200 dark:border-gray-700 mb-8 pb-8">
+<div class="now__topper">
-  <h2 class="m-0 mb-4 inline">
+  <h2>
-    <a class="text-gray-700 dark:text-white text-xl font-black leading-tight tracking-normal md:text-2xl no-underline not-prose" href="/now">
+    <a href="/now">Now</a>
-      Now
-    </a>
   </h2>
   <div class="dark:text-white text-gray-800">
     <p>I'm a software developer in Camarillo, California. I enjoy hanging out with my beautiful family and 4 rescue dogs, technology, automation,

src/_includes/partials/paginator.liquid

@@ -1,13 +1,13 @@
-<nav class="flex justify-between mt-8 items-center">
+<nav class="pagination">
   {% if pagination.href.previous %}
     <a href="{{ pagination.href.previous }}">
-      <button class="py-2 pr-4 dark:text-blue-400 text-blue-600" aria-label="Previous page [&>svg]:h-5 [&>svg]:w-5">
+      <button aria-label="Previous page [&>svg]:h-5 [&>svg]:w-5">
         {% tablericon "arrow-left" "Previous" %}
       </button>
     </a>
   {% else %}
     <button
-      class="py-2 pr-4 cursor-not-allowed disabled:opacity-50 [&>svg]:h-5 [&>svg]:w-5"
+      class="disabled"
       aria-label="Previous page (disabled)"
       disabled>
       {% tablericon "arrow-left" "Prevous" %}
@@ -18,13 +18,13 @@
   </div>
   {% if pagination.href.next %}
     <a href="{{ pagination.href.next }}">
-      <button class="py-2 pl-4 dark:text-blue-400 text-blue-600 [&>svg]:h-5 [&>svg]:w-5" aria-label="Next page">
+      <button aria-label="Next page">
         {% tablericon "arrow-right" "Next" %}
       </button>
     </a>
   {% else %}
     <button
-      class="py-2 pl-4 cursor-not-allowed disabled:opacity-50 [&>svg]:h-5 [&>svg]:w-5"
+      class="disabled"
       aria-label="Next page (disabled)"
       disabled>
       {% tablericon "arrow-right" "Next" %}

src/_includes/partials/popular-posts.liquid

@@ -1,16 +1,16 @@
 {% assign posts = posts | getPopularPosts: analytics %}
-<div class="not-prose">
+<div class="popular-posts">
-  <h2 class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:md:h-7 [&>svg]:md:w-7 [&>svg]:inline icon--bold m-0 text-xl flex flex-row items-center font-black leading-tight tracking-normal dark:text-white md:text-2xl mt-8 mb-4">
+  <h2>
     {% tablericon "flame" "Popular" %}
     Popular posts
   </h2>
-  <ul class="list-inside list-disc pl-5 md:pl-10">
+  <ul>
     {% for post in posts limit: 5 %}
-      <li class="mt-1.5 mb-2">
+      <li>
         <a href="{{post.url}}" title="{{ post.data.title | escape}}">
           {{ post.data.title }}
         </a>
       </li>
     {% endfor %}
   </ul>
-</div>
+</div>

src/_includes/partials/post-tags.liquid

@@ -1,11 +1,9 @@
-<div class="mt-8">
+{% for tag in tags %}
-  {% for tag in tags %}
+  {% if tag != "posts" %}
-    {% if tag != "posts" %}
+    <a href="/tags/{{ tag }}">
-      <a href="/tags/{{ tag }}">
+      <div
-        <div
+        class="pill--button pill--button__small"
-          class="pill--button pill--button__small"
+        data-pagefind-filter="tags">{{ tag }}</div>
-          data-pagefind-filter="tags">{{ tag }}</div>
+    </a>
-      </a>
+  {% endif %}
-    {% endif %}
+{% endfor %}
-  {% endfor %}
-</div>

src/_includes/partials/webmentions/comments.liquid

@@ -1,18 +1,18 @@
 {% if mentions['in-reply-to'].size > 0 %}
-  <h2 class="text-lg md:text-xl font-black leading-tight dark:text-white">Comments</h2>
+  <h2>Comments</h2>
-  <div class="mt-4 mb-4 flex flex-col items-center not-prose">
+  <div class="interaction__wrapper comments">
     {% for mention in mentions['in-reply-to'] %}
-      <div class="border-bottom flex flex-row items-center border-gray-100 pb-4 w-full">
+      <div class="comment__wrapper">
-        <div class="group flex flex-row space-between items-center">
+        <div class="comment__wrapper--interior">
           <a href={{mention.url}}>
-            <div class="bg-gray-900 dark:bg-white h-14 w-14 border-4 border-white dark:border-gray-900 transition-all ease-in-out duration-300 group-hover:border-blue-800 dark:group-hover:border-blue-200 rounded-full overflow-hidden">
+            <div class="avatar__wrapper">
-                {% image mention.author.photo, mention.author.name %}
+                {% image mention.author.photo, mention.author.name, 'avatar__wrapper-image' %}
             </div>
           </a>
-          <div class="ml-3">
+          <div class="comment">
-            <a class="text-gray-700 dark:text-white" href={{mention.url}}>
+            <a href={{mention.url}}>
-              <p class="text-sm group-hover:text-blue-800 dark:group-hover:text-blue-200">{{ mention.content.text }}</p>
+              <p>{{ mention.content.text }}</p>
-              <p class="mt-1 text-xs group-hover:text-blue-800 dark:group-hover:text-blue-200">{{ mention.published | isoDateOnly }}</p>
+              <time>{{ mention.published | isoDateOnly }}</time>
             </a>
           </div>
         </div>

src/_includes/partials/webmentions/container.liquid

@@ -1,5 +1,5 @@
 {% if webmentions %}
-  <div class="border-t border-gray-200 mt-12 pt-12 dark:border-gray-700">
+  <div class="webmentions__wrapper">
     {% assign mentions = webmentions.mentions | webmentionsByUrl: page.url %}
     {% render "partials/webmentions/interaction.liquid", mentions: mentions, type: 'repost-of' %}
     {% render "partials/webmentions/interaction.liquid", mentions: mentions, type: 'like-of' %}

src/_includes/partials/webmentions/interaction.liquid

@@ -6,14 +6,14 @@
   {% endif %}
 {% endcapture -%}
 {% if mentions[type].size > 0 %}
-  <h2 class="text-lg md:text-xl font-black leading-tight dark:text-white">{{ title }}</h2>
+  <h2>{{ title }}</h2>
-  <div class="flex flex-row items-center mt-4 mb-6">
+  <div class="interaction__wrapper">
-    <ul class="ml-3 flex flex-row flex-wrap">
+    <ul>
       {% for mention in mentions[type] %}
-        <li class="-ml-3 inline">
+        <li>
           <a href={{mention.url}}>
-            <div class="bg-gray-900 dark:bg-white h-14 w-14 border-4 border-white dark:border-gray-900 transition-all ease-in-out duration-300 hover:border-blue-800 dark:hover:border-blue-200 rounded-full overflow-hidden">
+            <div class="avatar__wrapper">
-              {% image mention.author.photo, mention.author.name %}
+              {% image mention.author.photo, mention.author.name, 'avatar__wrapper-image' %}
             </div>
           </a>
         </li>

src/_includes/partials/webmentions/links.liquid

@@ -1,10 +1,10 @@
 {% if mentions['link-to'].size > 0 %}
-  <h2 class="text-lg md:text-xl font-black leading-tight dark:text-white">Links</h2>
+  <h2>Links</h2>
-  <div class="mt-2.5 flex flex-col not-prose">
+  <div class="interaction__wrapper">
-    <ul class="list-inside list-disc pl-5 md:pl-10">
+    <ul>
       {% for mention in mentions['link-to'] %}
-        <li class="mt-1.5 mb-2">
+        <li>
-          <a href="{{ mention.url }}" class="text-blue-600 hover:text-blue-600 dark:text-blue-400 dark:hover:text-blue-200">
+          <a href="{{ mention.url }}">
             {{ mention.name }}
           </a>
         </li>

src/_includes/post.liquid

@@ -6,18 +6,18 @@ schema: blog
 <article class="h-entry" data-pagefind-body>
   {% if link %}
     <a class="no-underline" href="{{ link }}">
-      <h2 class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:md:h-7 [&>svg]:md:w-7 [&>svg]:-mt-1 [&>svg]:md:-mt-1.5 [&>svg]:inline icon--bold p-name m-0 text-xl font-black leading-tight tracking-normal hover:text-blue-800 text-gray-800 dark:text-white dark:hover:text-blue-200 md:text-2xl ease-in-out duration-300 pt-8" data-pagefind-meta="title">
+      <h2 data-pagefind-meta="title">
         {% tablericon 'link' title %}
         {{ title }}
       </h2>
     </a>
   {% else %}
-    <h2 class="p-name text-xl md:text-2xl font-black leading-tight dark:text-white pt-8" data-pagefind-meta="title">{{ title }}</h2>
+    <h2 class="p-name" data-pagefind-meta="title">{{ title }}</h2>
   {% endif %}
   <span class="p-author h-card hidden">{{ meta.author }}</span>
-  <time class="mt-2 mb-6 block text-sm dt-published" datetime="{{ date }}">{{ date | readableDate }}</time>
+  <time class="dt-published" datetime="{{ date }}">{{ date | readableDate }}</time>
   <div class="p-summary hidden">{{ post_excerpt | markdown }}</div>
-  <div class="e-content prose dark:prose-invert hover:prose-a:text-blue-800 dark:hover:prose-a:text-blue-200  max-w-full text-gray-800 dark:text-white">
+  <div class="e-content">
     {{ content }}
   </div>
 </article>

src/_includes/webrings/css-joy.liquid

@@ -1,19 +1,16 @@
-<div class="mb-4">
+<div class="webring__wrapper">
   <a class="no-underline" href="https://cs.sjoy.lol">
-    <h3 class="m-0 text-xl font-bold leading-tight tracking-normal dark:text-white md:text-2xl mb-6 text-center">
+    <h3 class="text-center">CSS JOY Webring</h3>
-      CSS JOY Webring
-    </h3>
   </a>
-  <div class="flex flex-row justify-center items-center">
+  <div class="webring__centered">
-    <a class="[&>svg]:h-5 [&>svg]:w-5 link--icon" href="https://webri.ng/webring/cssjoy/previous?via=https://coryd.dev/webrings">
+    <a href="https://webri.ng/webring/cssjoy/previous?via=https://coryd.dev/webrings">
       {% tablericon "arrow-left" "Previous site" %}
     </a>
-    <div class="flex justify-center">
+    <a class="pill--button" href="https://webri.ng/webring/cssjoy/random?via=https://coryd.dev/webrings">
-      <a href="https://webri.ng/webring/cssjoy/random?via=https://coryd.dev/webrings" class="[&>svg]:h-6 [&>svg]:w-6 icon--bold mx-4 flex flex-row items-center font-semibold p-2 rounded-full !no-underline !text-white dark:text-gray-900 bg-blue-600 dark:bg-blue-400 hover:bg-blue-800 dark:hover:bg-blue-200">
+      {% tablericon "dice-3" "Random site" %}
-        {% tablericon "dice-3" "Random site" %}
+      Random
-      </a>
+    </a>
-    </div>
+    <a href="https://webri.ng/webring/cssjoy/next?via=https://coryd.dev/webrings">
-    <a class="[&>svg]:h-5 [&>svg]:w-5 link--icon" href="https://webri.ng/webring/cssjoy/next?via=https://coryd.dev/webrings">
       {% tablericon "arrow-right" "Next site" %}
     </a>
   </div>

src/_includes/webrings/the-claw.liquid

@@ -1,17 +1,11 @@
-<div class="mb-4">
+<div class="webring__wrapper">
-  <div class="w-full flex justify-center">
+  <div class="webring__centered">
     {% image './src/assets/img/webrings/theclaw.png', 'The Claw Webring' %}
   </div>
-  <h3 class="m-0 text-xl font-bold leading-tight tracking-normal dark:text-white md:text-2xl mb-6 text-center">
+  <h3 class="text-center">The Claw Webring</h3>
-    The Claw Webring
+  <div class="webring__centered">
-  </h3>
+    <a href="https://github.com/whitep4nth3r/the-claw-webring" class="pill--button">
-  <div class="flex justify-center">
+      {% tablericon "user-plus" "Join!" %} Join!
-    <a href="https://github.com/whitep4nth3r/the-claw-webring" class="flex flex-row items-start md:items-center font-semibold py-2 px-4 rounded-full !no-underline !text-white dark:text-gray-900 bg-blue-600 dark:bg-blue-400 hover:bg-blue-800 dark:hover:bg-blue-200">
-        <span class="[&>svg]:h-5 [&>svg]:w-5 icon--bold pt-1 md:pt-0 mr-1">
-          {% tablericon "user-plus" "Join!" %}
-        </span>
-      <span>Join!</span>
     </a>
   </div>
-</div>
+</div>
-

src/assets/styles/prism.css

@@ -6,7 +6,7 @@ pre[class*='language-'] {
   color: #d9e0ee;
   background: none;
   text-shadow: 0 1px rgba(0, 0, 0, 0.3);
-  font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
+  font-family: ml, ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
   text-align: left;
   white-space: pre;
   word-spacing: normal;

src/index.html

@@ -24,35 +24,19 @@ meta:
 
 {% if pagination.pageNumber == 0 %}{% include "partials/now/topper.liquid" status:status %}{% endif %} {% for post in pagination.items %} {% if post.data.published %}
 <article class="h-entry">
-  <div
+    <a class="no-underline" href="{{ post.url }}">
-    class="mb-8 border-b border-gray-200 pb-4 text-gray-800 dark:border-gray-700 dark:text-white"
+      <h2>
-  >
+        {{ post.data.title }}
-    <a class="no-underline" href="{% if post.data.link %}{{ post.data.link }}{% else %}{{ post.url }}{% endif %}">
+      </h2>
-      {% if post.data.link %}
-        <h2 class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:md:h-7 [&>svg]:md:w-7 [&>svg]:-mt-1 [&>svg]:md:-mt-1.5 [&>svg]:inline icon--bold p-name m-0 text-xl font-black leading-tight tracking-normal hover:text-blue-800 dark:text-white dark:hover:text-blue-200 md:text-2xl ease-in-out duration-300">
-          {% tablericon 'link' post.data.title %}
-          {{ post.data.title }}
-        </h2>
-      {% else %}
-        <h2
-          class="p-name m-0 text-xl font-black leading-tight tracking-normal hover:text-blue-800 dark:text-white dark:hover:text-blue-200 md:text-2xl ease-in-out duration-300"
-        >
-          {{ post.data.title }}
-        </h2>
-      {% endif %}
     </a>
     <span class="p-author h-card hidden">{{ meta.siteName }}</span>
-    <div class="my-2 text-sm">
+    <time class="dt-published" datetime="{{ post.date }}">
-      <time class="dt-published" datetime="{{ post.date }}">
+      {{ post.date | date: "%m.%Y" }}
-        {{ post.date | date: "%m.%Y" }} {% if post.data.link %} • <a class="flex-none font-normal no-underline" href="{{ post.url }}">Permalink</a>{% endif %}
+    </time>
-      </time>
+    <p class="p-summary">{{ post.data.post_excerpt | markdown }}</p>
-    </div>
+    <a class="no-underline read-more" href="{{ post.url }}">
-    <p class="p-summary mt-0">{{ post.data.post_excerpt | markdown }}</p>
+      Read more
-    {% unless post.data.link %}
+      {% tablericon "arrow-right" "Read more" %}
-      <div class="mt-4 flex items-center justify-between">
+  </a>
-        <a class="flex-none font-normal no-underline" href="{{ post.url }}">Read more &rarr;</a>
-      </div>
-    {% endunless %}
-  </div>
 </article>
 {% endif %} {% endfor %} {% include "partials/paginator.liquid" %}

src/pages/404.html

@@ -3,30 +3,20 @@ title: 404
 layout: default
 permalink: /404.html
 ---
-
+<div class="four-oh-four__wrapper">
-{% image './src/assets/img/404.jpg', title, 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full' %}
+  {% image './src/assets/img/404.jpg', title, 'image__banner' %}
-<div class="text-center w-full">
+  <div class="text-center">
-  <h2
+    <h2 class="page__header">{{ title }}</h2>
-    class="m-0 text-4xl font-black leading-tight tracking-normal dark:text-white md:text-6xl mb-4"
+    <h3>What kind of idiots do you have working here?</h3>
-  >
+    <div class="flex justify-center">
-    {{ title }}
+      <a href="/" class="pill--button">
-  </h2>
+        {% tablericon "receipt-2" "Receipt" %} Skip out on the room service bill
-  <h3
+      </a>
-    class="m-0 text-xl font-bold leading-tight tracking-normal dark:text-white md:text-2xl mb-6"
+    </div>
-  >
-    What kind of idiots do you have working here?
-  </h3>
-  <div class="flex justify-center">
-    <a
-      href="/"
-      class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:inline icon--bold font-semibold py-2 px-4 rounded-full !no-underline !text-white dark:text-gray-900 bg-blue-600 dark:bg-blue-400 hover:bg-blue-800 dark:hover:bg-blue-200"
-    >
-      {% tablericon "receipt-2" "Receipt" %} Skip out on the room service bill
-    </a>
   </div>
+  <hr />
+  {% render "partials/popular-posts.liquid", posts: collections.posts, analytics: analytics %}
 </div>
-<hr />
-{% render "partials/popular-posts.liquid", posts: collections.posts, analytics: analytics %}
 <script>
   document.addEventListener('DOMContentLoaded', function () {
     plausible('404', { props: { path: document.location.pathname } })

src/pages/about.md

@@ -3,14 +3,13 @@ title: About
 layout: default
 permalink: /about.html
 ---
-
+<div class="avatar__wrapper">
-<div class="flex items-center justify-center w-full not-prose mb-6">
+  <div class="avatar">
-  <div class="border border-blue-600 dark:border-blue-400 bg-white rounded-full overflow-hidden p-4 w-64 h-64 md:w-96 md:h-96 flex items-center [&>*]:w-full [&>*]:h-auto">
     {% capture about_alt %}{{ meta.siteName }} - image by David Neal / @reverentgeek{% endcapture %}
     {% image './src/assets/img/avatar.webp', about_alt %}
   </div>
 </div>
-<h1 class="text-xxl font-black -leading-tight tracking-normal dark:text-white md:text-3xl text-center">Hi, I'm Cory</h1>
+<h2 class="page__header text-center">Hi, I'm Cory</h2>
 
 I'm a software developer in Camarillo, California. I enjoy hanging out with my beautiful family and 4 rescue dogs, technology, automation, [music](https://last.fm/user/coryd_), writing, [reading](https://app.thestorygraph.com/profile/coryd), [tv](https://trakt.tv/users/cdransf) and [movies](https://trakt.tv/users/cdransf).
 

src/pages/blogroll.md

@@ -4,12 +4,7 @@ layout: default
 permalink: /blogroll.html
 description: 'These are awesome blogs that I enjoy and you may enjoy too.'
 ---
-
+<h2 class="page__header">{{ title }}</h2>
-<h2
-  class="m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mb-2"
->
-  {{ title }}
-</h2>
 
 - [Ashur Cabrera](https://multiline.co/mment)
 - [Chris Burnell](https://chrisburnell.com)

src/pages/contact-success.html

@@ -4,25 +4,12 @@ layout: default
 permalink: /contact/success.html
 ---
 
-<div class="text-center w-full">
+<div class="text-center">
-  <h2
+  <h2>{{ title }}</h2>
-    class="m-0 text-4xl font-black leading-tight tracking-normal dark:text-white md:text-6xl mb-4"
+  <h3>I'll be in touch soon!</h3>
-  >
+  <a href="/" class="pill--button">
-    {{ title }}
+    {% tablericon "home-2" "Home" %} Head home
-  </h2>
+  </a>
-  <h3
-    class="m-0 text-xl font-bold leading-tight tracking-normal dark:text-white md:text-2xl mb-6"
-  >
-    I'll be in touch soon!
-  </h3>
-  <div class="flex justify-center">
-    <a
-      href="/"
-      class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:inline icon--bold font-semibold py-2 px-4 rounded-full !no-underline !text-white dark:text-gray-900 bg-blue-600 dark:bg-blue-400 hover:bg-blue-800 dark:hover:bg-blue-200"
-    >
-      {% tablericon "home-2" "Home" %} Head home
-    </a>
-  </div>
 </div>
-<hr />
+<hr class="large__spacing" />
 {% render "partials/popular-posts.liquid", posts: collections.posts, analytics: analytics %}

src/pages/contact.md

@@ -4,16 +4,10 @@ layout: default
 permalink: /contact.html
 description: 'How to contact me.'
 ---
-
+<h2 class="page__header">{{ title }}</h2>
-<h2
+<div class="contact__wrapper">
-  class="m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mb-2"
+  <div class="column contact__description">
->
+    <p>Fill out the form to get in touch. Or I've got other options 👇🏻</p>
-  {{ title }}
-</h2>
-
-<div class="flex flex-col md:flex-row">
-  <div class="w-full md:w-1/2 md:pr-6">
-    <p class="mt-0">Fill out the form to get in touch. Or I've got other options 👇🏻</p>
     <ul>
       <li>Ping me on <a href="https://social.lol/@cory">Mastodon</a></li>
       <li>Message me on Signal or iMessage (if you have my phone number)</li>
@@ -21,19 +15,19 @@ description: 'How to contact me.'
       <li>File an issue on the appropriate repo over at <a href="https://github.com/cdransf">GitHub</a></li>
     </ul>
   </div>
-  <form class="mt-3 md:mt-0 flex flex-col items-center justify-center w-full md:w-1/2" method="POST" action="/contact/success" name="contact" netlify netlify-honeypot="bot-field">
+  <form class="column" method="POST" action="/contact/success" name="contact" netlify netlify-honeypot="bot-field">
     <label class="hidden">
       Don't fill this out if you're human: <input name="bot-field" />
     </label>
-    <label class="w-full">
+    <label>
       <span class="hidden">Name</span>
-      <input type="text" name="name" placeholder="Name" class="w-full outline-none bg-white dark:bg-gray-900 p-2 mb-6 rounded-sm border border-blue-600 focus:border-blue-800 dark:border-blue-400 dark:focus:border-blue-200 transition-colors ease-in-out duration-300" required />
+      <input type="text" name="name" placeholder="Name" required />
     </label>
-    <label class="w-full">
+    <label>
       <span class="hidden">Email</span>
-      <input type="email" name="email" placeholder="Email" class="w-full outline-none bg-white dark:bg-gray-900 p-2 mb-6 rounded-sm border border-blue-600 focus:border-blue-800 dark:border-blue-400 dark:focus:border-blue-200 transition-colors ease-in-out duration-300" required />
+      <input type="email" name="email" placeholder="Email" required />
     </label>
-    <textarea name="message" placeholder="Message"  class="w-full h-40 resize-none outline-none bg-white dark:bg-gray-900 p-2 mb-6 rounded-sm border border-blue-600 focus:border-blue-800 dark:border-blue-400 dark:focus:border-blue-200 transition-colors ease-in-out duration-300" required></textarea>
+    <textarea name="message" placeholder="Message" required></textarea>
-    <button class="pill--button w-1/2" type="submit">Send message</button>
+    <button class="pill--button" type="submit">Send message</button>
   </form>
 </div>

src/pages/feeds.md

@@ -5,13 +5,9 @@ permalink: /feeds.html
 description: 'Content feeds exposed by and generated from my site.'
 ---
 
-<h2
+<h2 class="page__header">{{ title }}</h2>
-class="m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mb-2"
->
-{{ title }}
-</h2>
 
-These are web feeds, also known as [RSS](https://en.wikipedia.org/wiki/RSS) or [Atom](<https://en.wikipedia.org/wiki/Atom_(web_standard)>) feeds. Subscribe by copying the URL from the address bar into your newsreader. Visit [About Feeds](https://aboutfeeds.com) to get started with newsreaders and subscribing. It's free.
+These are web feeds, also known as [RSS](https://en.wikipedia.org/wiki/RSS) or [Atom](https://en.wikipedia.org/wiki/Atom_(web_standard)) feeds. Subscribe by copying the URL from the address bar into your newsreader. Visit [About Feeds](https://aboutfeeds.com) to get started with newsreaders and subscribing. It's free.
 
 - Posts ([RSS](https://feedpress.me/coryd) • [JSON](https://feedpress.me/coryd.json)): posts from my site.
 - Links ([RSS](https://feedpress.me/coryd-links) • [JSON](https://feedpress.me/coryd-links.json)): links I've liked.

src/pages/now.html

@@ -4,31 +4,31 @@ layout: now
 permalink: /now.html
 description: "See what I'm doing now."
 ---
-<h2 class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:md:h-7 [&>svg]:md:w-7 [&>svg]:-mt-1 [&>svg]:md:-mt-1.5 [&>svg]:inline icon--bold m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mt-8 mb-4">
+<h2 class="now__section--header">
   {% tablericon "clock-heart" "Currently" %}
   Currently
 </h2>
-<div class="pl-4 md:pl-8">
+<div class="now__section--text">
     {% render "partials/now/status.liquid", status:status %}
-  <p class="my-2 [&>svg]:h-5 [&>svg]:w-5 [&>svg]:inline">
+  <p>
     {% tablericon "map-2" "Map" %}
     Living in Camarillo, California with my beautiful family, 4 rescue dogs and a guinea pig.
   </p>
-  <p class="my-2 [&>svg]:h-5 [&>svg]:w-5 [&>svg]:inline">
+  <p>
     {% tablericon "play-basketball" "NBA - Lakers" %}
     Rooting for the <a href="https://lakers.com">Lakers</a>. 💜💛
   </p>
 </div>
-<h2 class="[&>svg]:h-5 [&>svg]:w-5 [&>svg]:md:h-7 [&>svg]:md:w-7 [&>svg]:-mt-1 [&>svg]:md:-mt-1.5 [&>svg]:inline icon--bold m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mt-8 mb-4">
+<h2 class="now__section--header">
   {% tablericon "terminal-2" "Making" %}
   Making
 </h2>
-<div class="pl-4 md:pl-8">
+<div class="now__section--text">
-  <p class="my-2 [&>svg]:h-5 [&>svg]:w-5 [&>svg]:inline">
+  <p>
     {% tablericon "code" "Hacking" %}
     Hacking away on projects like this page, my <a href="/">blog</a>, and whatever else I can find time for.
   </p>
-  <p class="my-2 [&>svg]:h-5 [&>svg]:w-5 [&>svg]:inline">
+  <p>
     {% tablericon "hand-stop" "Ad and tracker-blocking" %}
     Assembling lists of <a href="https://github.com/cdransf/awesome-adblock">ad and tracker-blocking tools</a>.
   </p>

src/pages/referrals.md

@@ -4,12 +4,7 @@ layout: default
 permalink: /referrals.html
 description: 'Referral links for services that I use.'
 ---
-
+<h2 class="page__header">{{ title }}</h2>
-<h2
-  class="m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mb-2"
->
-  {{ title }}
-</h2>
 
 Referral links for services I use. I save some money, and you do as well if you choose to use them.
 

src/pages/stats.html

@@ -6,10 +6,10 @@ permalink: /stats.html
 <p>My first post was published on <strong class="highlight-text">{{ collections.postStats.firstPostDate | dateToReadableDate }}</strong> and my most recent one was published on <strong class="highlight-text">{{ collections.postStats.lastPostDate | dateToReadableDate }}</strong>. I've published <strong class="highlight-text">{{ collections.postStats.postCount }} posts</strong> containing <strong class="highlight-text">{{ collections.postStats.totalWordCount }} words</strong> and <strong class="highlight-text">{{ collections.postStats.totalCodeBlockCount }} code samples</strong>.</p>
 <p>Posts have, on average, <strong class="highlight-text">{{ collections.postStats.avgWordCount | round }} words</strong> and a gap of <strong class="highlight-text">{{ collections.postStats.avgDays | round }} days</strong> between them.</p>
 <h2>Popular posts</h2>
-<ol class="list-inside pl-5 md:pl-10">
+<ol>
   {% assign posts = collections.posts | getPopularPosts: analytics %}
   {% for post in posts limit: 10 %}
-  <li class="mt-1.5 mb-2">
+  <li>
     <a href="{{post.url}}" title="{{ post.data.title | escape}}">
       {{ post.data.title }}
     </a>

src/pages/tagList.md

@@ -11,24 +11,19 @@ templateEngineOverride: liquid,md
 ---
 {% assign posts = collections[tag] | reverse %}
 {% for post in posts %}
-<div class="mb-8 border-b border-gray-200 pb-4 dark:border-gray-700">
+<article class="h-entry">
-  <a class="!no-underline" href="{{ post.url }}">
+  <a class="no-underline" href="{{ post.url }}">
-    <h2
+    <h2>{{ post.data.title }}</h2>
-      class="m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl"
-    >
-      {{ post.data.title }}
-    </h2>
   </a>
-  <div class="my-2 text-sm">
+  <time class="dt-published" datetime="{{ post.date }}">
-    <time class="dt-published" datetime="{{ post.date }}">
+    {{ post.date | date: "%m.%Y" }}
-      {{ post.date | date: "%m.%Y" }}
+  </time>
-    </time>
+  {%- if post.data.post_excerpt %}
-  </div>
+    <p class="p-summary">{{ post.data.post_excerpt | markdown }}</p>
-  {% if post.data.post_excerpt %}
+  {% endif -%}
-  <p class="p-summary mt-0">{{ post.data.post_excerpt | markdown }}</p>
+  <a class="no-underline read-more" href="{{ post.url }}">
-  {% endif %}
+    Read more
-  <div class="mt-4 flex items-center justify-between">
+    {% tablericon "arrow-right" "Read more" %}
-    <a class="flex-none font-normal !no-underline" href="{{ post.url }}">Read more &rarr;</a>
+  </a>
-  </div>
+</article>
-</div>
 {% endfor %}

src/pages/tags.md

@@ -6,7 +6,7 @@ permalink: /tags.html
 ---
 {% for tag in collections.tagList %}
 <span>
-  <a href="/tags/{{ tag }}" class="!no-underline">
+  <a href="/tags/{{ tag }}" class="no-underline">
     <button class="pill--button">
       {{ tag }}
     </button>

src/pages/uses.md

@@ -5,18 +5,13 @@ permalink: /uses.html
 description: 'Software, tools and services that I use regularly.'
 image: https://coryd.dev/assets/img/pages/uses.jpg
 ---
-
+<h2 class="page__header">{{ title }}</h2>
-<h2
-  class="m-0 text-xl font-black leading-tight tracking-normal dark:text-white md:text-2xl mb-2"
->
-  {{ title }}
-</h2>
 
 Software and services that I use for work and my own enjoyment.
 
-{% image 'https://coryd.dev/assets/img/pages/uses.jpg', 'My desk', 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full', 'eager' %}
+{% image 'https://coryd.dev/assets/img/pages/uses.jpg', 'My desk', 'image__banner', 'eager' %}
 
-<h3 className="text-xl font-extrabold leading-9 tracking-tight text-gray-900 dark:text-gray-100 sm:text-2xl sm:leading-10 md:text-4xl md:leading-14">Computer setup</h3>
+<h3>Computer setup</h3>
 
 - Midnight MacBook Air (2022 - M2)
 - 27" Dell Monitor
@@ -25,22 +20,22 @@ Software and services that I use for work and my own enjoyment.
 - Homepod Mini for audio
 - Raspberry Pi for Homebridge
 
-<h3 className="text-xl font-extrabold leading-9 tracking-tight text-gray-900 dark:text-gray-100 sm:text-2xl sm:leading-10 md:text-4xl md:leading-14">Desk and chair</h3>
+<h3>Desk and chair</h3>
 
 - My desk is a custom made corner desk I bought on Etsy years ago. It's sturdy, has tons of storage and finally arrived with a chip on the surface to add some character after the first one got lost by the freight company on the journey from Michigan to Los Angeles. I probably _wouldn't_ repeat the experience, but I do love the desk.
 - [Herman Miller Aeron chair](https://www.hermanmiller.com/products/seating/office-chairs/aeron-chairs/): it's pretty comfortable and makes swiveling around my corner desk easy.
 
-<h3 className="text-xl font-extrabold leading-9 tracking-tight text-gray-900 dark:text-gray-100 sm:text-2xl sm:leading-10 md:text-4xl md:leading-14">macOS + iOS</h3>
+<h3>macOS + iOS</h3>
 
 - [Bear](https://bear.app): native, fast and flexible — it's a breeze to use across Apple's ecosystem.
 - [Fantastical](https://flexibits.com/fantastical): the best and most powerful calendaring app for the Apple ecosystem, bar none.
 - [Ivory](https://tapbots.com/ivory): a beautifully designed and extremely well built Mastodon app — I use it as my go-to client across all of my devices.
 
-<h3 className="text-xl font-extrabold leading-9 tracking-tight text-gray-900 dark:text-gray-100 sm:text-2xl sm:leading-10 md:text-4xl md:leading-14">iOS</h3>
+<h3>iOS</h3>
 
 - [FontCase](https://apps.apple.com/us/app/fontcase-manage-your-type/id1205074470): for managing/installing fonts.
 
-<h3 className="text-xl font-extrabold leading-9 tracking-tight text-gray-900 dark:text-gray-100 sm:text-2xl sm:leading-10 md:text-4xl md:leading-14">macOS</h3>
+<h3>macOS</h3>
 
 - [Gmail Desktop](https://github.com/timche/gmail-desktop): yes it's Electron, but it's thoughtfully developed and built (be sure to opt into the latest beta updates ahead of the next major version).
 - [Rectangle](https://rectangleapp.com): to quickly move around/organize/snap application windows. Using a Mac without it now feels like it's broken.
@@ -52,14 +47,14 @@ Software and services that I use for work and my own enjoyment.
 - [SoundSource](https://rogueamoeba.com/soundsource): a handy utility for better, more granular control on macOS.
 - [Sleeve](https://replay.software/sleeve): a lightweight music controller (that also supports scrobbling).
 
-<h3 className="text-xl font-extrabold leading-9 tracking-tight text-gray-900 dark:text-gray-100 sm:text-2xl sm:leading-10 md:text-4xl md:leading-14">Dev tools</h3>
+<h3>Dev tools</h3>
 
 - [Visual Studio Code](https://code.visualstudio.com): the reigning industry standard for web development work.
 - [iTerm2](https://iterm2.com): a more configurable terminal than the one macOS ships with. I've used it for a long time now and it's still my go-to.
 - [Catppuccin](https://github.com/catppuccin): nearly as ubiquitous as Dracula but lighter and more playful, I've started using this theme wherever I'm looking at/reading/writing code.
 - [Mono Lisa](https://monolisa.dev): a relatively new find, I've been enjoying how pleasant and readable this font is (and have even gone so far as to install it on iOS via [FontCase](https://apps.apple.com/us/app/fontcase-manage-your-type/id1205074470)).
 
-<h3 className="text-xl font-extrabold leading-9 tracking-tight text-gray-900 dark:text-gray-100 sm:text-2xl sm:leading-10 md:text-4xl md:leading-14">Services</h3>
+<h3>Services</h3>
 
 - [Gmail](https://www.google.com/gmail/about): it's exceedingly well established and Google's apps are so ubiquitous that it's hard to avoid.
 - <a class="plausible-event-name=NextDNS+referral" href="https://nextdns.io/?from=m56mt3z6">NextDNS</a>: a privacy-focused, set it and forget it DNS service. I use their security features on my home network and a profile with strict ad-blocking rules on all of my devices.

src/posts/2023/displaying-listening-data-from-apple-music-using-musickit.md

@@ -205,7 +205,7 @@ The templating for my site is all written in [liquid.js](https://liquidjs.com) a
 
 We have an object containing arrays of objects — we iterate through each object for the appropriate section (tracks aren't displayed at the moment) and build the resulting display[^3]. This isn't perfect by any means, but, it does provide a nice little visualization of what I'm listening to and `240` tracks feels adequate as a rolling window into that activity.
 
-{% image 'https://cdn.coryd.dev/blog/albums-artists.jpg', 'Albums and artists', 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full' %}
+{% image 'https://cdn.coryd.dev/blog/albums-artists.jpg', 'Albums and artists', 'image__banner' %}
 
 [^1]: There are some good options to do this, but there aren't a _ton_ and the age of some of the apps is concerning. [Marvis](https://appaddy.wixsite.com/marvis) is far and away your best choice here.
 [^2]: Making sure that you update the values you obtained, including the path to your downloaded `.p8` file.

src/posts/2023/fastmail-handling-inbound-email-with-regex-filters-now-with-chatgpt.md

@@ -11,7 +11,7 @@ I've been using Fastmail for years now and have explored a number of different a
 
 For now, I've approached filtering my mail by applying regular expressions to reasonably broad categories of incoming mail[^2]. My thinking with this approach is that will scale better over the long term by applying heuristics to common phrases and patterns in incoming mail without the need to apply rules to senders on a per address or domain basis.
 
-{% image 'https://cdn.coryd.dev/blog/fastmail-workflow.jpg', 'A diagram of my Fastmail workflow', 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full' %}
+{% image 'https://cdn.coryd.dev/blog/fastmail-workflow.jpg', 'A diagram of my Fastmail workflow', 'image__banner' %}
 
 ## Alias-specific rules
 

src/posts/2023/from-ics-to-json-surfacing-anticipated-albums.md

@@ -47,16 +47,16 @@ Rendering the output is as simple as:
 
 ```liquid
 {% if albumReleases.size > 0 %}
-  <h2 class="m-0 text-xl flex flex-row items-center font-black leading-tight tracking-normal dark:text-white md:text-2xl mt-8 mb-4 [&>svg]:h-7 [&>svg]:w-7">
+  <h2 class="now__section--header">
-    {% tablericon "calendar" "Albums I'm looking forward to" %}
+    {% tablericon "calendar-time" "Anticipated albums" %}
-    <div class="ml-1">Albums I'm looking forward to</div>
+    Anticipated albums
   </h2>
-  <ul class="list-inside list-disc pl-5 md:pl-10">
+  <ul>
     {% for album in albumReleases %}
-      <li class="mt-1.5 mb-2">
+      <li>
-        <span class="font-bold">{{ album.startDate | readableDate }}: </span>
+        <strong>{{ album.date | readableDate }}: </strong>
-        <a href="https://{{album.location}}" title="{{album.summary | escape}}">
+        <a href="https://{{album.url}}" title="{{album.title | escape}}">
-          {{album.summary}}
+          {{album.title}}
         </a>
       </li>
     {% endfor %}
@@ -66,6 +66,6 @@ Rendering the output is as simple as:
 
 {% endraw %}
 Leaving us with:
-{% image 'https://cdn.coryd.dev/blog/album-releases.jpg', 'Albums I\'m looking forward to', 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full' %}
+{% image 'https://cdn.coryd.dev/blog/album-releases.jpg', 'Albums I\'m looking forward to', 'image__banner' %}
 
 [^1]: At this point, a dev playground.

src/posts/2023/it-is-possible-to-both-stream-and-buy-music.md

@@ -5,8 +5,8 @@ description: "I've been streaming music again in part (and I know this is ridicu
 draft: false
 tags:
   - music
-link: https://pxlnv.com/linklog/stream-buy-music/
 ---
+**[Via Pixel Envy](https://pxlnv.com/linklog/stream-buy-music/)**    
 > Streaming services are all the piracy with none of the guilt. It is a broken model that is only slightly better than when this stuff came through illicit downloads from risky places. If someone can buy music outright, artists will benefit, but I cannot see how it implicitly makes them a better music enjoyer.
 
 [I've been streaming music again](https://coryd.dev/posts/2023/i-dont-want-streaming-music/) in part (and I know this is ridiculous) because Spotify is ubiquitous, well-integrated and has a — well — [API that's usable for my purposes](https://coryd.dev/posts/2023/road-to-madness-apple-music-charts/). I still buy music I stream from Bandcamp and archive it and I still buy too many shirts to support bands (I also import missing music into playlists and playlist folders as an analog to albums). I've also been able to scrobble listens more reliably and found some really great bands like [PUP](https://open.spotify.com/artist/6A7uqgC2N1nUhrCLAytHxN). We'll see if it lasts, but it feels like a good balance for now.<!-- excerpt -->

src/posts/2023/migrating-your-letterboxd-data.md

@@ -6,8 +6,8 @@ draft: false
 tags:
   - development
   - tech
-link: https://github.com/jensb89/trakt---letterboxd-import
 ---
+**[Via GitHub](https://github.com/jensb89/trakt---letterboxd-import)**    
 In case you missed the news [Letterboxd was acquired](https://www.nytimes.com/2023/09/29/business/media/letterboxd-new-owner.html) and, assurances about nothing changing quickly followed. But, I think it's safe to say we've seen this movie before.<!-- excerpt -->
 
 I went ahead and migrated my watch history from Letterboxd over to [Trakt](https://trakt.tv), which I already use to keep track of the TV shows I'm watching. To do this I used [a tool](https://github.com/jensb89/trakt---letterboxd-import) written by [Jens Brauer](https://github.com/jensb89). Run through the steps in the README and you should be able to export your data from the newly acquired service[^1].

src/posts/2023/now-page-grouping-episodes-of-same-show.md

@@ -14,7 +14,7 @@ I made a minor update to how I'm normalizing TV data for display on my now page.
 
 By _minor_ I mean one of those things that may well break inexplicably depending on where the data lands. Instead of returning a normalized array based directly off the data returned by [Trakt](https://trakt.tv)'s API I'm instead collecting episodes in an array, checking as I iterate through the response to see if an episode of the same show exists and replacing that object with a mutated object designed to display the range of episodes watched for the show.
 
-{% image 'https://cdn.coryd.dev/blog/grouped-tv.jpg', 'Grouped TV episodes', 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full' %}
+{% image 'https://cdn.coryd.dev/blog/grouped-tv.jpg', 'Grouped TV episodes', 'image__banner' %}
 
 {% raw %}
 

src/posts/2023/now-playing-eleventy-netlify-edge-functions-emoji.md

@@ -169,6 +169,6 @@ Finally, if the page this all lives on is loaded by a client without JavaScript
 
 All of this, yields the single line at the bottom of this image — updated on each visit.
 
-{% image 'https://cdn.coryd.dev/blog/now-playing.jpg', 'Now playing', 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full' %}
+{% image 'https://cdn.coryd.dev/blog/now-playing.jpg', 'Now playing', 'image__banner' %}
 
 [^1]: Plus explicit conditions matching David Bowie and Minor Threat.

src/posts/2023/optimizing-for-performance-with-eleventy.md

@@ -141,6 +141,6 @@ For this page in particular, the images that are rendered above the fold are set
 
 All of these boilerplate steps leave us with a quick to load, accessible and resilient site:
 
-{% image 'https://cdn.coryd.dev/blog/page-speed.jpg', 'Pagespeed scores for coryd.dev/now', 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full' %}
+{% image 'https://cdn.coryd.dev/blog/page-speed.jpg', 'Pagespeed scores for coryd.dev/now', 'image__banner' %}
 
 [^1]: It's easy, flexible and helps mitigate my lack of an eye for design by providing safe baselines.

src/posts/2023/road-to-madness-apple-music-charts.md

@@ -134,7 +134,7 @@ _Cool_[^4]. GitHub triggers a rebuild of the site every hour, Netlify builds it,
 
 There are some significant issues with this approach: it doesn't capture listens to an album in a loop (like me playing the new Outer Heaven record today — hails 🤘). It can get wonky when my diff function hits a track order that elicits a false positive return value.
 
-{% image 'https://cdn.coryd.dev/blog/charlie.jpg', 'Charlie Day standing in front of charts', 'border border-blue-600 dark:border-blue-400 rounded-lg overflow-hidden [&>*]:w-full' %}
+{% image 'https://cdn.coryd.dev/blog/charlie.jpg', 'Charlie Day standing in front of charts', 'image__banner' %}
 
 "But Cory there's last.fm." I hear this, I love last.fm, but I've got concerns about its age, ownership and maintenance. I don't want to be on the wrong end of a scream test when the wrong (right?) server rack gets decommissioned.
 

tailwind.config.js

@@ -1,42 +0,0 @@
-module.exports = {
-  theme: {
-    extend: {
-      spacing: {
-        '9/16': '56.25%',
-      },
-      lineHeight: {
-        11: '2.75rem',
-        12: '3rem',
-        13: '3.25rem',
-        14: '3.5rem',
-      },
-      fontFamily: {
-        sans: ['silka', 'Inter', 'Roboto', 'Helvetica Neue', 'Arial Nova', 'Nimbus Sans', 'Arial', 'system-ui', 'sans-serif'],
-        mono: [
-          'ui-monospace',
-          'Cascadia Code',
-          'Source Code Pro',
-          'Menlo',
-          'Consolas',
-          'DejaVu Sans Mono',
-          'monospace',
-        ],
-      },
-      backgroundImage: {
-        'cover-gradient':
-          'linear-gradient(180deg,transparent 0,rgba(0,0,0,.15) 70%,rgba(0,0,0,.5))',
-      },
-    },
-  },
-  corePlugins: {
-    aspectRatio: false,
-  },
-  plugins: [
-    require('@tailwindcss/typography'),
-    require('@tailwindcss/line-clamp'),
-    require('@catppuccin/tailwindcss'),
-    require('@tailwindcss/aspect-ratio'),
-    require('tailwind-scrollbar'),
-  ],
-  content: ['./src/**/*.md', './src/**/*.html', './src/_includes/**/*.liquid'],
-}

tailwind.css

@@ -1,298 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-body {
-  --pagefind-ui-primary: theme(colors.blue.600);
-  --pagefind-ui-text: theme(colors.gray.800);
-  --pagefind-ui-background: theme(colors.white);
-  --pagefind-ui-border: theme(colors.gray.200);
-  --pagefind-ui-tag: theme(colors.gray.200);
-  --pagefind-ui-border-width: 2px;
-  --pagefind-ui-border-radius: 8px;
-  --pagefind-ui-image-border-radius: 8px;
-  --pagefind-ui-image-box-ratio: 3 / 2;
-  --pagefind-ui-font: sans-serif;
-}
-
-body,
-html {
-  @apply font-sans;
-  color: theme(colors.gray.900);
-}
-
-.pagefind-ui__form mark {
-  color: theme(colors.white) !important;
-  background: theme(colors.blue.600) !important;
-}
-
-.pagefind-ui__form .pagefind-ui__result-link {
-  color: theme(colors.blue.600) !important;
-  @apply !ease-in-out;
-  @apply !duration-300;
-}
-
-.pagefind-ui__form .pagefind-ui__result-link:hover,
-.pagefind-ui__form .pagefind-ui__result-link:focus,
-.pagefind-ui__form .pagefind-ui__result-link:active {
-  color: theme(colors.blue.600) !important;
-}
-
-::-moz-selection {
-  color: theme(colors.white);
-  background: theme(colors.blue.600);
-}
-
-::selection {
-  color: theme(colors.white);
-  background: theme(colors.blue.600);
-}
-
-.active,
-.active svg {
-  color: theme(colors.blue.600);
-}
-
-.header-anchor {
-  text-decoration: none !important;
-}
-
-h1 > a.header-anchor {
-  font-weight: 800;
-}
-
-h2 > a.header-anchor {
-  font-weight: 700;
-}
-
-a,
-.prose a {
-  color: theme(colors.blue.600);
-  @apply ease-in-out;
-  @apply duration-300;
-}
-
-a:hover,
-a:focus,
-a:active,
-.prose a:hover,
-.prose a:focus,
-.prose a:active {
-  color: theme(colors.blue.800);
-}
-
-.highlight-text {
-  @apply text-white;
-  @apply p-0.5;
-  background-color: theme(colors.blue.600);
-}
-
-p > a,
-span > a,
-blockquote > a,
-li > a {
-  text-decoration: underline !important;
-}
-
-code {
-  @apply font-mono;
-  @apply text-gray-50;
-  padding: 0.25rem;
-}
-
-pre {
-  border: 1px solid theme(colors.gray.700);
-  border-radius: 0 !important;
-  @apply scrollbar-thin;
-  @apply scrollbar-thumb-blue-600;
-  @apply scrollbar-track-blue-100;
-}
-
-.pill--button {
-  @apply !appearance-none;
-  @apply font-semibold;
-  @apply py-2;
-  @apply px-4;
-  @apply mr-1;
-  @apply mb-3;
-  @apply rounded-full;
-  @apply text-white;
-  @apply transition-colors;
-  @apply ease-in-out;
-  @apply duration-300;
-  background-color: theme(colors.blue.600) !important;
-}
-
-.pill--button.pill--button__small {
-  @apply py-1;
-  @apply px-2;
-  @apply mr-2;
-  @apply mb-2;
-  @apply text-sm;
-  @apply inline-block;
-}
-
-.pill--button:hover,
-.pill--button:active,
-.pill--button:focus {
-  background-color: theme(colors.blue.800) !important;
-}
-
-[data-tablericon-name] {
-  stroke-width: 1.4;
-}
-
-.icon--bold > svg {
-  stroke-width: 2;
-}
-
-.link--icon > svg {
-  color: theme(colors.gray.700);
-  @apply ease-in-out;
-  @apply duration-300;
-}
-
-.link--icon:hover > svg {
-  color: theme(colors.blue.600);
-}
-
-.icon--spin > svg {
-  @apply animate-spin;
-}
-
-.icon--inline > svg {
-  @apply inline;
-}
-
-.pagefind-ui__search-input {
-  @apply !w-full;
-  @apply !outline-none;
-  @apply !bg-white;
-  @apply !rounded-sm;
-  @apply !border;
-  @apply !border-blue-600;
-  @apply !transition-colors;
-  @apply !ease-in-out;
-  @apply !duration-300;
-}
-
-.pagefind-ui__search-input:focus {
-  @apply !border-blue-800;
-}
-
-.post-graph {
-  @apply my-5;
-}
-
-.post-graph__wrapper {
-  @apply relative;
-  @apply h-8;
-  @apply mb-1.5;
-  @apply flex;
-  @apply items-center;
-}
-
-.post-graph__progress {
-  @apply bg-blue-600;
-  @apply h-full;
-}
-
-.post-graph__year {
-  @apply font-mono;
-}
-
-.post-graph__progress,
-.post-graph__data {
-  @apply ml-2.5;
-}
-
-@media (prefers-color-scheme: dark) {
-  body {
-    --pagefind-ui-primary: theme(colors.blue.400);
-    --pagefind-ui-text: theme(colors.white);
-    --pagefind-ui-background: theme(colors.gray.900);
-    --pagefind-ui-border: theme(colors.gray.700);
-    --pagefind-ui-tag: theme(colors.gray.700);
-  }
-
-  a,
-  .prose a {
-    color: theme(colors.blue.400);
-  }
-
-  a:hover,
-  a:focus,
-  a:active,
-  .prose a:hover,
-  .prose a:focus,
-  .prose a:active {
-    color: theme(colors.blue.200);
-  }
-
-  .highlight-text {
-    background-color: theme(colors.blue.400);
-  }
-
-  .link--icon svg {
-    color: theme(colors.gray.200);
-  }
-
-  .link--icon:hover svg {
-    color: theme(colors.blue.200);
-  }
-
-  .pagefind-ui__form mark {
-    background: theme(colors.blue.400) !important;
-  }
-
-  .pagefind-ui__form .pagefind-ui__result-link {
-    color: theme(colors.blue.400) !important;
-  }
-
-  .pagefind-ui__form .pagefind-ui__result-link:hover,
-  .pagefind-ui__form .pagefind-ui__result-link:focus,
-  .pagefind-ui__form .pagefind-ui__result-link:active {
-    color: theme(colors.blue.600) !important;
-  }
-
-  ::-moz-selection {
-    background: theme(colors.blue.400);
-  }
-
-  ::selection {
-    background: theme(colors.blue.400);
-  }
-
-  .active,
-  .active svg {
-    color: theme(colors.blue.400);
-  }
-
-  pre {
-    @apply scrollbar-thumb-blue-400;
-  }
-
-  .pill--button {
-    color: theme(colors.white);
-    background: theme(colors.blue.400);
-  }
-
-  .pill--button:hover,
-  .pill--button:active,
-  .pill--button:focus {
-    background: theme(colors.blue.200);
-  }
-
-  .pagefind-ui__search-input {
-    @apply !border-blue-400;
-    @apply !bg-gray-900
-  }
-
-  .pagefind-ui__search-input:focus {
-    @apply !border-blue-200
-  }
-
-  .post-graph__progress {
-    @apply bg-blue-400;
-  }
-}