feat: remove astro-imagetools

It's not worth the effort.

astro.config.mjs

@@ -4,7 +4,6 @@ import prefetch from '@astrojs/prefetch';
 import sitemap from '@astrojs/sitemap';
 import tailwind from '@astrojs/tailwind';
 import swup from '@swup/astro';
-import { astroImageTools } from 'astro-imagetools';
 import pagefind from 'astro-pagefind';
 import webmanifest from 'astro-webmanifest';
 import { defineConfig } from 'astro/config';
@@ -33,7 +32,6 @@ export default defineConfig({
 			compat: true,
 		}),
 		swup({ globalInstance: true }),
-		astroImageTools,
 		prefetch(),
 		pagefind(),
 		sitemap({

package.json

@@ -34,7 +34,6 @@
 		"@swup/scripts-plugin": "^2.1.0",
 		"@swup/scroll-plugin": "^3.3.2",
 		"astro": "^4.5.4",
-		"astro-imagetools": "^0.9.0",
 		"astro-pagefind": "^1.4.0",
 		"astro-seo": "^0.8.3",
 		"astro-webmanifest": "^1.0.0",
@@ -58,7 +57,6 @@
 		"react-dom": "npm:@preact/compat@latest",
 		"reading-time": "^1.5.0",
 		"sal.js": "^0.8.5",
-		"sharp": "^0.33.2",
 		"swup": "^4.6.0",
 		"tailwindcss": "^3.4.1",
 		"unist-util-visit": "^5.0.0"

pnpm-lock.yaml

@@ -57,9 +57,6 @@ dependencies:
   astro:
     specifier: ^4.5.4
     version: 4.5.4(@types/node@20.11.27)(typescript@5.4.2)
-  astro-imagetools:
-    specifier: ^0.9.0
-    version: 0.9.0(astro@4.5.4)
   astro-pagefind:
     specifier: ^1.4.0
     version: 1.4.0(astro@4.5.4)
@@ -129,9 +126,6 @@ dependencies:
   sal.js:
     specifier: ^0.8.5
     version: 0.8.5
-  sharp:
-    specifier: ^0.33.2
-    version: 0.33.2
   swup:
     specifier: ^4.6.0
     version: 4.6.0
@@ -504,10 +498,6 @@ packages:
       - supports-color
     dev: false
 
-  /@astropub/codecs@0.4.4:
-    resolution: {integrity: sha512-jHmdZK2B7dfelTsVzkWVb93WPjuKkHz07xUcyg5WtUxTeCCxdDVLnvZlsB5PC2r7HmJLf03TP1QYb1ZgrEebyQ==}
-    dev: false
-
   /@babel/code-frame@7.22.13:
     resolution: {integrity: sha512-XktuhWlJ5g+3TJXc5upd9Ks1HutSArik6jf2eAjYFyIOf4ej3RN+184cZbzDvbPnuTJIUhPKKJE3cIsYTiAT3w==}
     engines: {node: '>=6.9.0'}
@@ -2406,14 +2396,6 @@ packages:
     resolution: {integrity: sha512-IqRuJtQff7YHHBk4G8YZ45uB9BaAGcwQeVzgj/zj8/UdOhtQpEIupUhSk8dys6spFIWVZVeK20CzGEnqR5SbqA==}
     dev: false
 
-  /@emnapi/runtime@0.45.0:
-    resolution: {integrity: sha512-Txumi3td7J4A/xTTwlssKieHKTGl3j4A1tglBx72auZ49YK7ePY6XZricgIg9mnZT4xPfA+UPCUdnhRuEFDL+w==}
-    requiresBuild: true
-    dependencies:
-      tslib: 2.6.2
-    dev: false
-    optional: true
-
   /@esbuild/aix-ppc64@0.19.11:
     resolution: {integrity: sha512-FnzU0LyE3ySQk7UntJO4+qIiQgI7KoODnZg5xzXIrFJlKd2P2gwHsHY4927xj9y5PJmJSzULiUCWmv7iWnNa7g==}
     engines: {node: '>=12'}
@@ -3129,194 +3111,6 @@ packages:
     resolution: {integrity: sha512-trnsAYxU3xnS1gPHPyU961coFyLkh4gAD/0zQ5mymY4yOZ+CYvsPqUbOFSw0aDM4y0tV7tiFxL/1XfXPNC6IPg==}
     dev: true
 
-  /@img/sharp-darwin-arm64@0.33.2:
-    resolution: {integrity: sha512-itHBs1rPmsmGF9p4qRe++CzCgd+kFYktnsoR1sbIAfsRMrJZau0Tt1AH9KVnufc2/tU02Gf6Ibujx+15qRE03w==}
-    engines: {glibc: '>=2.26', node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [arm64]
-    os: [darwin]
-    requiresBuild: true
-    optionalDependencies:
-      '@img/sharp-libvips-darwin-arm64': 1.0.1
-    dev: false
-    optional: true
-
-  /@img/sharp-darwin-x64@0.33.2:
-    resolution: {integrity: sha512-/rK/69Rrp9x5kaWBjVN07KixZanRr+W1OiyKdXcbjQD6KbW+obaTeBBtLUAtbBsnlTTmWthw99xqoOS7SsySDg==}
-    engines: {glibc: '>=2.26', node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [x64]
-    os: [darwin]
-    requiresBuild: true
-    optionalDependencies:
-      '@img/sharp-libvips-darwin-x64': 1.0.1
-    dev: false
-    optional: true
-
-  /@img/sharp-libvips-darwin-arm64@1.0.1:
-    resolution: {integrity: sha512-kQyrSNd6lmBV7O0BUiyu/OEw9yeNGFbQhbxswS1i6rMDwBBSX+e+rPzu3S+MwAiGU3HdLze3PanQ4Xkfemgzcw==}
-    engines: {macos: '>=11', npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [arm64]
-    os: [darwin]
-    requiresBuild: true
-    dev: false
-    optional: true
-
-  /@img/sharp-libvips-darwin-x64@1.0.1:
-    resolution: {integrity: sha512-eVU/JYLPVjhhrd8Tk6gosl5pVlvsqiFlt50wotCvdkFGf+mDNBJxMh+bvav+Wt3EBnNZWq8Sp2I7XfSjm8siog==}
-    engines: {macos: '>=10.13', npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [x64]
-    os: [darwin]
-    requiresBuild: true
-    dev: false
-    optional: true
-
-  /@img/sharp-libvips-linux-arm64@1.0.1:
-    resolution: {integrity: sha512-bnGG+MJjdX70mAQcSLxgeJco11G+MxTz+ebxlz8Y3dxyeb3Nkl7LgLI0mXupoO+u1wRNx/iRj5yHtzA4sde1yA==}
-    engines: {glibc: '>=2.26', npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [arm64]
-    os: [linux]
-    requiresBuild: true
-    dev: false
-    optional: true
-
-  /@img/sharp-libvips-linux-arm@1.0.1:
-    resolution: {integrity: sha512-FtdMvR4R99FTsD53IA3LxYGghQ82t3yt0ZQ93WMZ2xV3dqrb0E8zq4VHaTOuLEAuA83oDawHV3fd+BsAPadHIQ==}
-    engines: {glibc: '>=2.28', npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [arm]
-    os: [linux]
-    requiresBuild: true
-    dev: false
-    optional: true
-
-  /@img/sharp-libvips-linux-s390x@1.0.1:
-    resolution: {integrity: sha512-3+rzfAR1YpMOeA2zZNp+aYEzGNWK4zF3+sdMxuCS3ey9HhDbJ66w6hDSHDMoap32DueFwhhs3vwooAB2MaK4XQ==}
-    engines: {glibc: '>=2.28', npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [s390x]
-    os: [linux]
-    requiresBuild: true
-    dev: false
-    optional: true
-
-  /@img/sharp-libvips-linux-x64@1.0.1:
-    resolution: {integrity: sha512-3NR1mxFsaSgMMzz1bAnnKbSAI+lHXVTqAHgc1bgzjHuXjo4hlscpUxc0vFSAPKI3yuzdzcZOkq7nDPrP2F8Jgw==}
-    engines: {glibc: '>=2.26', npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [x64]
-    os: [linux]
-    requiresBuild: true
-    dev: false
-    optional: true
-
-  /@img/sharp-libvips-linuxmusl-arm64@1.0.1:
-    resolution: {integrity: sha512-5aBRcjHDG/T6jwC3Edl3lP8nl9U2Yo8+oTl5drd1dh9Z1EBfzUKAJFUDTDisDjUwc7N4AjnPGfCA3jl3hY8uDg==}
-    engines: {musl: '>=1.2.2', npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [arm64]
-    os: [linux]
-    requiresBuild: true
-    dev: false
-    optional: true
-
-  /@img/sharp-libvips-linuxmusl-x64@1.0.1:
-    resolution: {integrity: sha512-dcT7inI9DBFK6ovfeWRe3hG30h51cBAP5JXlZfx6pzc/Mnf9HFCQDLtYf4MCBjxaaTfjCCjkBxcy3XzOAo5txw==}
-    engines: {musl: '>=1.2.2', npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [x64]
-    os: [linux]
-    requiresBuild: true
-    dev: false
-    optional: true
-
-  /@img/sharp-linux-arm64@0.33.2:
-    resolution: {integrity: sha512-pz0NNo882vVfqJ0yNInuG9YH71smP4gRSdeL09ukC2YLE6ZyZePAlWKEHgAzJGTiOh8Qkaov6mMIMlEhmLdKew==}
-    engines: {glibc: '>=2.26', node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [arm64]
-    os: [linux]
-    requiresBuild: true
-    optionalDependencies:
-      '@img/sharp-libvips-linux-arm64': 1.0.1
-    dev: false
-    optional: true
-
-  /@img/sharp-linux-arm@0.33.2:
-    resolution: {integrity: sha512-Fndk/4Zq3vAc4G/qyfXASbS3HBZbKrlnKZLEJzPLrXoJuipFNNwTes71+Ki1hwYW5lch26niRYoZFAtZVf3EGA==}
-    engines: {glibc: '>=2.28', node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [arm]
-    os: [linux]
-    requiresBuild: true
-    optionalDependencies:
-      '@img/sharp-libvips-linux-arm': 1.0.1
-    dev: false
-    optional: true
-
-  /@img/sharp-linux-s390x@0.33.2:
-    resolution: {integrity: sha512-MBoInDXDppMfhSzbMmOQtGfloVAflS2rP1qPcUIiITMi36Mm5YR7r0ASND99razjQUpHTzjrU1flO76hKvP5RA==}
-    engines: {glibc: '>=2.28', node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [s390x]
-    os: [linux]
-    requiresBuild: true
-    optionalDependencies:
-      '@img/sharp-libvips-linux-s390x': 1.0.1
-    dev: false
-    optional: true
-
-  /@img/sharp-linux-x64@0.33.2:
-    resolution: {integrity: sha512-xUT82H5IbXewKkeF5aiooajoO1tQV4PnKfS/OZtb5DDdxS/FCI/uXTVZ35GQ97RZXsycojz/AJ0asoz6p2/H/A==}
-    engines: {glibc: '>=2.26', node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [x64]
-    os: [linux]
-    requiresBuild: true
-    optionalDependencies:
-      '@img/sharp-libvips-linux-x64': 1.0.1
-    dev: false
-    optional: true
-
-  /@img/sharp-linuxmusl-arm64@0.33.2:
-    resolution: {integrity: sha512-F+0z8JCu/UnMzg8IYW1TMeiViIWBVg7IWP6nE0p5S5EPQxlLd76c8jYemG21X99UzFwgkRo5yz2DS+zbrnxZeA==}
-    engines: {musl: '>=1.2.2', node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [arm64]
-    os: [linux]
-    requiresBuild: true
-    optionalDependencies:
-      '@img/sharp-libvips-linuxmusl-arm64': 1.0.1
-    dev: false
-    optional: true
-
-  /@img/sharp-linuxmusl-x64@0.33.2:
-    resolution: {integrity: sha512-+ZLE3SQmSL+Fn1gmSaM8uFusW5Y3J9VOf+wMGNnTtJUMUxFhv+P4UPaYEYT8tqnyYVaOVGgMN/zsOxn9pSsO2A==}
-    engines: {musl: '>=1.2.2', node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [x64]
-    os: [linux]
-    requiresBuild: true
-    optionalDependencies:
-      '@img/sharp-libvips-linuxmusl-x64': 1.0.1
-    dev: false
-    optional: true
-
-  /@img/sharp-wasm32@0.33.2:
-    resolution: {integrity: sha512-fLbTaESVKuQcpm8ffgBD7jLb/CQLcATju/jxtTXR1XCLwbOQt+OL5zPHSDMmp2JZIeq82e18yE0Vv7zh6+6BfQ==}
-    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [wasm32]
-    requiresBuild: true
-    dependencies:
-      '@emnapi/runtime': 0.45.0
-    dev: false
-    optional: true
-
-  /@img/sharp-win32-ia32@0.33.2:
-    resolution: {integrity: sha512-okBpql96hIGuZ4lN3+nsAjGeggxKm7hIRu9zyec0lnfB8E7Z6p95BuRZzDDXZOl2e8UmR4RhYt631i7mfmKU8g==}
-    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [ia32]
-    os: [win32]
-    requiresBuild: true
-    dev: false
-    optional: true
-
-  /@img/sharp-win32-x64@0.33.2:
-    resolution: {integrity: sha512-E4magOks77DK47FwHUIGH0RYWSgRBfGdK56kIHSVeB9uIS4pPFr4N2kIVsXdQQo4LzOsENKV5KAhRlRL7eMAdg==}
-    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0, npm: '>=9.6.5', pnpm: '>=7.1.0', yarn: '>=3.2.0'}
-    cpu: [x64]
-    os: [win32]
-    requiresBuild: true
-    dev: false
-    optional: true
-
   /@import-maps/resolve@1.0.1:
     resolution: {integrity: sha512-tWZNBIS1CoekcwlMuyG2mr0a1Wo5lb5lEHwwWvZo+5GLgr3e9LLDTtmgtCWEwBpXMkxn9D+2W9j2FY6eZQq0tA==}
     dev: true
@@ -4179,7 +3973,7 @@ packages:
       nopt: 5.0.0
       npmlog: 5.0.1
       rimraf: 3.0.2
-      semver: 7.5.4
+      semver: 7.6.0
       tar: 6.2.0
     transitivePeerDependencies:
       - encoding
@@ -6051,7 +5845,7 @@ packages:
       debug: 4.3.4(supports-color@9.4.0)
       globby: 11.1.0
       is-glob: 4.0.3
-      semver: 7.5.4
+      semver: 7.6.0
       tsutils: 3.21.0(typescript@5.4.2)
       typescript: 5.4.2
     transitivePeerDependencies:
@@ -6743,23 +6537,6 @@ packages:
       - supports-color
     dev: true
 
-  /astro-imagetools@0.9.0(astro@4.5.4):
-    resolution: {integrity: sha512-iZCSiUbFr0h8HSyX2Fl/hzc3RlmVjNstWwsZZSyQKW9vRmMny/bd3qL3p8wuC6ISsAvtHfVnJLmorhhRhwVOcw==}
-    engines: {node: ^14.15.0 || >=16.0.0}
-    peerDependencies:
-      astro: '>=0.26 || >=1.0.0-beta'
-    dependencies:
-      '@astropub/codecs': 0.4.4
-      astro: 4.5.4(@types/node@20.11.27)(typescript@5.4.2)
-      file-type: 17.1.1
-      find-cache-dir: 3.3.2
-      find-up: 6.3.0
-      object-hash: 3.0.0
-      potrace: 2.1.8
-    optionalDependencies:
-      imagetools-core: 3.0.2
-    dev: false
-
   /astro-pagefind@1.4.0(astro@4.5.4):
     resolution: {integrity: sha512-WMUlS0TTqIDqygplj/cxKU+l3oI+zB2qgYNMZed5R5nXuw8HhAKATog9zazuN05TOSWxI2Ap9+9WAYnnJ+4C7A==}
     peerDependencies:
@@ -7309,7 +7086,7 @@ packages:
   /builtins@5.0.1:
     resolution: {integrity: sha512-qwVpFEHNfhYJIzNRBvd2C1kyo6jz3ZSMPyyuR47OPdiKWlbYnZNyDWuyR175qDnAJLiCo5fBBqPb3RiXgWlkOQ==}
     dependencies:
-      semver: 7.5.4
+      semver: 7.6.0
     dev: true
 
   /byline@5.0.0:
@@ -8524,6 +8301,7 @@ packages:
   /deep-extend@0.6.0:
     resolution: {integrity: sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA==}
     engines: {node: '>=4.0.0'}
+    requiresBuild: true
 
   /deep-is@0.1.4:
     resolution: {integrity: sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==}
@@ -8660,6 +8438,7 @@ packages:
     engines: {node: '>=0.10'}
     hasBin: true
     requiresBuild: true
+    dev: true
 
   /detect-libc@2.0.2:
     resolution: {integrity: sha512-UX6sGumvvqSaXgdKGUsgZWqcUyIXZ/vZTrlRT/iobiKhGL0zL4d3osHj3uqllWJK+i+sixDS/3COVEOFbupFyw==}
@@ -9928,15 +9707,6 @@ packages:
       token-types: 4.2.1
     dev: true
 
-  /file-type@17.1.1:
-    resolution: {integrity: sha512-heRUMZHby2Qj6wZAA3YHeMlRmZNQTcb6VxctkGmM+mcM6ROQKvHpr7SS6EgdfEhH+s25LDshBjvPx/Ecm+bOVQ==}
-    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
-    dependencies:
-      readable-web-to-node-stream: 3.0.2
-      strtok3: 7.0.0
-      token-types: 5.0.1
-    dev: false
-
   /file-type@18.7.0:
     resolution: {integrity: sha512-ihHtXRzXEziMrQ56VSgU7wkxh55iNchFkosu7Y9/S+tXHdKyrGjVK0ujbqNnsxzea+78MaLhN6PGmfYSAv1ACw==}
     engines: {node: '>=14.16'}
@@ -11208,15 +10978,6 @@ packages:
     dependencies:
       '@types/node': 16.9.1
 
-  /imagetools-core@3.0.2:
-    resolution: {integrity: sha512-DlArpNiefCc1syIqvOONcE8L8IahN8GjwaEjm6wIJIvuKoFoI1RcKmWWfS2dYxSlTiSp2X5b3JnHDjUXmWqlVA==}
-    engines: {node: '>=12.0.0'}
-    requiresBuild: true
-    dependencies:
-      sharp: 0.29.3
-    dev: false
-    optional: true
-
   /import-cwd@3.0.0:
     resolution: {integrity: sha512-4pnzH16plW+hgvRECbDWpQl3cqtvSofHWh44met7ESfZ8UZOWWddm8hEyDTqREJ9RbYHY8gi8DqmaelApoOGMg==}
     engines: {node: '>=8'}
@@ -12639,7 +12400,7 @@ packages:
     resolution: {integrity: sha512-hXdUTZYIVOt1Ex//jAQi+wTZZpUpwBj/0QsOzqegb3rGMMeJiSEu5xLHnYfBrRV4RH2+OCSOO95Is/7x1WJ4bw==}
     engines: {node: '>=10'}
     dependencies:
-      semver: 7.5.4
+      semver: 7.6.0
     dev: true
 
   /make-error@1.3.6:
@@ -13840,15 +13601,6 @@ packages:
       tslib: 2.6.2
     dev: true
 
-  /node-abi@3.40.0:
-    resolution: {integrity: sha512-zNy02qivjjRosswoYmPi8hIKJRr8MpQyeKT6qlcq/OnOgA3Rhoae+IYOqsM9V5+JnHWmxKnWOT2GxvtqdtOCXA==}
-    engines: {node: '>=10'}
-    requiresBuild: true
-    dependencies:
-      semver: 7.6.0
-    dev: false
-    optional: true
-
   /node-abi@3.56.0:
     resolution: {integrity: sha512-fZjdhDOeRcaS+rcpve7XuwHBmktS1nS1gzgghwKUQQ8nTy2FdSDr6ZT8k6YhvlJeHmmQMYiT/IH9hfco5zeW2Q==}
     engines: {node: '>=10'}
@@ -13856,12 +13608,6 @@ packages:
     dependencies:
       semver: 7.6.0
 
-  /node-addon-api@4.3.0:
-    resolution: {integrity: sha512-73sE9+3UaLYYFmDsFZnqCInzPyh3MqIwZO9cw58yIqAZhONrrabrYyYe3TuIqtIiOuTXVhsGau8hcrhhwSsDIQ==}
-    requiresBuild: true
-    dev: false
-    optional: true
-
   /node-addon-api@6.1.0:
     resolution: {integrity: sha512-+eawOlIgy680F0kBzPUNFhMZGtJ1YmqM6l4+Crf4IkImjYrO/mqPwRMh352g23uIaQKFItcQ64I7KMaJxHgAVA==}
     requiresBuild: true
@@ -14016,7 +13762,7 @@ packages:
     dependencies:
       hosted-git-info: 4.1.0
       is-core-module: 2.13.1
-      semver: 7.5.4
+      semver: 7.6.0
       validate-npm-package-license: 3.0.4
     dev: true
 
@@ -14026,7 +13772,7 @@ packages:
     dependencies:
       hosted-git-info: 7.0.1
       is-core-module: 2.13.1
-      semver: 7.5.4
+      semver: 7.6.0
       validate-npm-package-license: 3.0.4
     dev: true
 
@@ -14547,7 +14293,7 @@ packages:
       got: 12.6.1
       registry-auth-token: 5.0.2
       registry-url: 6.0.1
-      semver: 7.5.4
+      semver: 7.6.0
     dev: true
 
   /pagefind@1.0.4:
@@ -15734,27 +15480,6 @@ packages:
     resolution: {integrity: sha512-gympg+T2Z1fG1unB8NH29yHJwnEaCH37Z32diPDku316OTnRPeMbiRV9kTrfZpocXjdfnWuFUl/Mj4BHaf6gnw==}
     dev: false
 
-  /prebuild-install@7.1.1:
-    resolution: {integrity: sha512-jAXscXWMcCK8GgCoHOfIr0ODh5ai8mj63L2nWrjuAgXE6tDyYGnx4/8o/rCgU+B4JSyZBKbeZqzhtwtC3ovxjw==}
-    engines: {node: '>=10'}
-    hasBin: true
-    requiresBuild: true
-    dependencies:
-      detect-libc: 2.0.2
-      expand-template: 2.0.3
-      github-from-package: 0.0.0
-      minimist: 1.2.8
-      mkdirp-classic: 0.5.3
-      napi-build-utils: 1.0.2
-      node-abi: 3.40.0
-      pump: 3.0.0
-      rc: 1.2.8
-      simple-get: 4.0.1
-      tar-fs: 2.1.1
-      tunnel-agent: 0.6.0
-    dev: false
-    optional: true
-
   /prebuild-install@7.1.2:
     resolution: {integrity: sha512-UnNke3IQb6sgarcZIDU3gbMeTp/9SSU1DAIkil7PrqG1vZlBtY5msYccSKSHDqa3hNg436IXK+SNImReuA1wEQ==}
     engines: {node: '>=10'}
@@ -16920,7 +16645,7 @@ packages:
     resolution: {integrity: sha512-0Ju4+6A8iOnpL/Thra7dZsSlOHYAHIeMxfhWQRI1/VLcT3WDBZKKtQt/QkBOsiIN9ZpuvHE6cGZ0x4glCMmfiA==}
     engines: {node: '>=12'}
     dependencies:
-      semver: 7.5.4
+      semver: 7.6.0
     dev: true
 
   /semver@5.7.2:
@@ -17038,22 +16763,6 @@ packages:
     resolution: {integrity: sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==}
     dev: true
 
-  /sharp@0.29.3:
-    resolution: {integrity: sha512-fKWUuOw77E4nhpyzCCJR1ayrttHoFHBT2U/kR/qEMRhvPEcluG4BKj324+SCO1e84+knXHwhJ1HHJGnUt4ElGA==}
-    engines: {node: '>=12.13.0'}
-    requiresBuild: true
-    dependencies:
-      color: 4.2.3
-      detect-libc: 1.0.3
-      node-addon-api: 4.3.0
-      prebuild-install: 7.1.1
-      semver: 7.6.0
-      simple-get: 4.0.1
-      tar-fs: 2.1.1
-      tunnel-agent: 0.6.0
-    dev: false
-    optional: true
-
   /sharp@0.32.6:
     resolution: {integrity: sha512-KyLTWwgcR9Oe4d9HwCwNM2l7+J0dUQwn/yf7S0EnTtb0eVS4RxO0eUSvxPtzT4F3SY+C4K6fqdv/DO27sJ/v/w==}
     engines: {node: '>=14.15.0'}
@@ -17068,36 +16777,6 @@ packages:
       tar-fs: 3.0.5
       tunnel-agent: 0.6.0
 
-  /sharp@0.33.2:
-    resolution: {integrity: sha512-WlYOPyyPDiiM07j/UO+E720ju6gtNtHjEGg5vovUk1Lgxyjm2LFO+37Nt/UI3MMh2l6hxTWQWi7qk3cXJTutcQ==}
-    engines: {libvips: '>=8.15.1', node: ^18.17.0 || ^20.3.0 || >=21.0.0}
-    requiresBuild: true
-    dependencies:
-      color: 4.2.3
-      detect-libc: 2.0.2
-      semver: 7.6.0
-    optionalDependencies:
-      '@img/sharp-darwin-arm64': 0.33.2
-      '@img/sharp-darwin-x64': 0.33.2
-      '@img/sharp-libvips-darwin-arm64': 1.0.1
-      '@img/sharp-libvips-darwin-x64': 1.0.1
-      '@img/sharp-libvips-linux-arm': 1.0.1
-      '@img/sharp-libvips-linux-arm64': 1.0.1
-      '@img/sharp-libvips-linux-s390x': 1.0.1
-      '@img/sharp-libvips-linux-x64': 1.0.1
-      '@img/sharp-libvips-linuxmusl-arm64': 1.0.1
-      '@img/sharp-libvips-linuxmusl-x64': 1.0.1
-      '@img/sharp-linux-arm': 0.33.2
-      '@img/sharp-linux-arm64': 0.33.2
-      '@img/sharp-linux-s390x': 0.33.2
-      '@img/sharp-linux-x64': 0.33.2
-      '@img/sharp-linuxmusl-arm64': 0.33.2
-      '@img/sharp-linuxmusl-x64': 0.33.2
-      '@img/sharp-wasm32': 0.33.2
-      '@img/sharp-win32-ia32': 0.33.2
-      '@img/sharp-win32-x64': 0.33.2
-    dev: false
-
   /shebang-command@1.2.0:
     resolution: {integrity: sha512-EV3L1+UQWGor21OmnvojK36mhg+TyIKDh3iFBKBohr5xeXIhNBcx8oWdgkTEEQ+BEFFYdLRuqMfd5L84N1V5Vg==}
     engines: {node: '>=0.10.0'}
@@ -17675,6 +17354,7 @@ packages:
   /strip-json-comments@2.0.1:
     resolution: {integrity: sha512-4gB8na07fecVVkOI6Rs4e7T6NOTki5EmL7TUduTs6bu3EdnSycntVJ4re8kgZA+wx9IueI2Y11bfbgwtzuE0KQ==}
     engines: {node: '>=0.10.0'}
+    requiresBuild: true
 
   /strip-json-comments@3.1.1:
     resolution: {integrity: sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==}

src/components/GalleryDetail.astro

@@ -3,7 +3,7 @@ import cx from 'classnames';
 
 import { animation, animationDelay } from '../data/site';
 
-import Picture from './Picture.astro';
+import Image from './Image.astro';
 import { Headline } from '.';
 
 const { entry } = Astro.props;
@@ -52,14 +52,7 @@ const imageLength = entry.data.images.length;
 					})}
 					{...animation}
 				>
-					<Picture
+					<Image alt={entry.data.title} src={src} />
-						alt={entry.data.title}
-						aspect={entry.data.aspect}
-						breakpoints={[500, 1000, 1500]}
-						format={['avif']}
-						loading={index === 0 ? 'eager' : 'lazy'}
-						src={src}
-					/>
 				</div>
 			))
 		}

src/components/Image.astro

@@ -1,15 +1,6 @@
 ---
 import cx from 'classnames';
 
-import { Img } from 'astro-imagetools/components';
-import type { ImgConfigOptions } from 'astro-imagetools';
-
-interface Props extends ImgConfigOptions {
-	class?: string;
-	noMargin?: boolean;
-	src: string;
-}
-
 const { class: className, noMargin, src, ...props } = Astro.props;
 
 const classes = cx(
@@ -22,17 +13,5 @@ const imageClasses =
 ---
 
 <div class={classes}>
-	{
+	<img class={imageClasses} decoding="async" loading="lazy" src={src} {...props} />
-		src.includes('.svg') ? (
-			<img class={imageClasses} src={src} {...(props as any)} />
-		) : (
-			<Img
-				attributes={{ class: imageClasses }}
-				breakpoints={[500, 1000, 1500]}
-				format="webp"
-				src={src}
-				{...props}
-			/>
-		)
-	}
 </div>

src/components/JournalList.astro

@@ -1,5 +1,5 @@
 ---
-import { Picture } from 'astro-imagetools/components';
+import { Picture } from 'astro:assets';
 
 import type { CollectionEntry } from 'astro:content';
 interface Props {
@@ -28,19 +28,13 @@ const { entries } = Astro.props;
 				>
 					<div class="absolute z-10 h-full w-full">
 						{data.cover ? (
-							<>
-								{data.cover.endsWith('.svg') ? (
-									<img src={data.cover} alt={data.title} />
-								) : (
 							<Picture
 								alt={data.title}
-										aspect={0.6}
+								formats={['avif', 'webp']}
-										breakpoints={[300, 500, 1000]}
+								height="937"
-										format={['avif']}
 								src={data.cover}
+								width="1500"
 							/>
-								)}
-							</>
 						) : (
 							<div
 								class="h-full w-full bg-gray-800 transition duration-300 ease-in-out group-hover:brightness-[90%] group-focus:brightness-[90%] dark:brightness-[50%] dark:group-hover:brightness-[100%] dark:group-focus:brightness-[100%]"

src/components/MarkdownImage.astro

@@ -1,8 +1,6 @@
 ---
 import cx from 'classnames';
 
-import { Img } from 'astro-imagetools/components';
-
 interface Props {
 	class?: string;
 	noMargin?: boolean;
@@ -19,11 +17,5 @@ const classes = cx(
 ---
 
 <div class={classes}>
-	{
+	<img src={src} decoding="async" loading="lazy" {...props} />
-		src.includes('.svg') ? (
-			<img src={src} {...props} />
-		) : (
-			<Img breakpoints={[500, 1000, 1500]} format="webp" src={src} {...props} />
-		)
-	}
 </div>

src/components/Picture.astro

@@ -1,38 +0,0 @@
----
-import cx from 'classnames';
-
-import { Picture as AstroImageToolsPicture } from 'astro-imagetools/components';
-import type { PictureConfigOptions } from 'astro-imagetools';
-
-interface Props extends PictureConfigOptions {
-	alt: string;
-	aspect: number;
-	breakpoints?: number[];
-	class?: string;
-	noMargin?: boolean;
-	src: string;
-}
-
-const { class: className, noMargin, src, ...props } = Astro.props;
-
-const classes = cx(
-	'image-shadow block h-auto w-full rounded-1 border-1 border-solid border-black/[0.1] bg-black/[0.1] shadow shadow-black/10 mbe-10 mbs-0 dark:border-white/[0.1] dark:opacity-[0.87] dark:shadow-white/5 border-x-0',
-	{ 'mbe-0': noMargin },
-	className
-);
----
-
-<div class={classes}>
-	{
-		src.includes('.svg') ? (
-			<img src={src} {...(props as any)} />
-		) : (
-			<AstroImageToolsPicture
-				breakpoints={[500, 1000, 1500]}
-				format={['avif']}
-				src={src}
-				{...props}
-			/>
-		)
-	}
-</div>

src/components/ProjectImage.astro

@@ -1,6 +1,6 @@
 ---
 import type { CollectionEntry } from 'astro:content';
-import Picture from './Picture.astro';
+import Image from './Image.astro';
 
 interface Props {
 	project: CollectionEntry<'projects'>;
@@ -16,12 +16,9 @@ const { project } = Astro.props;
 				<img class="image-border" alt={project.data.title} src={project.data.image.src} />
 			</div>
 		) : (
-			<Picture
+			<Image
 				alt={project.data.title}
-				aspect={project.data.image.aspectRatio}
-				breakpoints={[500, 1000, 1500]}
 				class="[&_img]:!w-full [&_img]:!max-w-none [&_picture]:!w-full [&_picture]:!max-w-none"
-				format={['avif']}
 				src={project.data.image.src}
 			/>
 		))

src/components/Toolbox.astro

@@ -1,5 +1,5 @@
 ---
-import { Img } from 'astro-imagetools/components';
+import { Image } from 'astro:assets';
 import { Link } from '.';
 
 import type { ToolsProps } from '../data/tools';
@@ -18,16 +18,7 @@ const { tools } = Astro.props;
 		tools.map(({ name, url, image }) => (
 			<li class="print:[&_img]:!hidden">
 				<Link href={url} title={name}>
-					<Img
+					<Image alt={name} widths={[128]} height={300} src={image} width={300} />
-						alt={name}
-						aspect={1}
-						breakpoints={[128]}
-						format="webp"
-						height={300}
-						placeholder="tracedSVG"
-						src={image}
-						width={300}
-					/>
 				</Link>
 			</li>
 		))

src/data/tools.ts

@@ -8,27 +8,27 @@ export const development = [
 	{
 		name: 'Neovim',
 		url: 'https://neovim.io/',
-		image: '/assets/images/tools/neovim.png',
+		image: '/assets/images/tools/webp/neovim.webp',
 	},
 	{
 		name: 'Tmux',
 		url: 'https://tmux.github.io/',
-		image: '/assets/images/tools/tmux.png',
+		image: '/assets/images/tools/webp/tmux.webp',
 	},
 	{
 		name: 'Wezterm',
 		url: 'https://wezfurlong.org/wezterm/',
-		image: '/assets/images/tools/wezterm.png',
+		image: '/assets/images/tools/webp/wezterm.webp',
 	},
 	{
 		name: 'Visual Studio Code',
 		url: 'https://code.visualstudio.com/',
-		image: '/assets/images/tools/visual-studio-code.png',
+		image: '/assets/images/tools/webp/visual-studio-code.webp',
 	},
 	{
 		name: 'Kaleidoscope',
 		url: 'https://kaleidoscope.app/',
-		image: '/assets/images/tools/kaleidoscope.png',
+		image: '/assets/images/tools/webp/kaleidoscope.webp',
 	},
 ];
 
@@ -36,32 +36,32 @@ export const design = [
 	{
 		name: 'Affinity Designer',
 		url: 'https://affinity.serif.com/designer/',
-		image: '/assets/images/tools/affinity-designer.png',
+		image: '/assets/images/tools/webp/affinity-designer.webp',
 	},
 	{
 		name: 'Affinity Photo',
 		url: 'https://affinity.serif.com/photo/',
-		image: '/assets/images/tools/affinity-photo.png',
+		image: '/assets/images/tools/webp/affinity-photo.webp',
 	},
 	{
 		name: 'Affinity Publisher',
 		url: 'https://affinity.serif.com/publisher/',
-		image: '/assets/images/tools/affinity-publisher.png',
+		image: '/assets/images/tools/webp/affinity-publisher.webp',
 	},
 	{
 		name: 'Eagle',
 		url: 'https://eagle.cool/',
-		image: '/assets/images/tools/eagle.png',
+		image: '/assets/images/tools/webp/eagle.webp',
 	},
 	{
 		name: 'Procreate',
 		url: 'https://procreate.com/',
-		image: '/assets/images/tools/procreate.png',
+		image: '/assets/images/tools/webp/procreate.webp',
 	},
 	{
 		name: 'Typeface',
 		url: 'https://typefaceapp.com/',
-		image: '/assets/images/tools/typeface.png',
+		image: '/assets/images/tools/webp/typeface.webp',
 	},
 ];
 
@@ -69,57 +69,57 @@ export const research = [
 	{
 		name: 'iA Writer',
 		url: 'https://ia.net/writer',
-		image: '/assets/images/tools/ia-writer.png',
+		image: '/assets/images/tools/webp/ia-writer.webp',
 	},
 	{
 		name: 'iA Presenter',
 		url: 'https://ia.net/presenter',
-		image: '/assets/images/tools/ia-presenter.png',
+		image: '/assets/images/tools/webp/ia-presenter.webp',
 	},
 	{
 		name: 'Obsidian',
 		url: 'https://obsidian.md/',
-		image: '/assets/images/tools/obsidian.png',
+		image: '/assets/images/tools/webp/obsidian.webp',
 	},
 	{
 		name: 'DEVONthink',
 		url: 'https://www.devontechnologies.com/apps/devonthink',
-		image: '/assets/images/tools/devonthink.png',
+		image: '/assets/images/tools/webp/devonthink.webp',
 	},
 	{
 		name: 'Raindrop.io',
 		url: 'https://raindrop.io/',
-		image: '/assets/images/tools/raindrop.io.png',
+		image: '/assets/images/tools/webp/raindrop.io.webp',
 	},
 	{
 		name: 'Reeder',
 		url: 'https://reeder.app/',
-		image: '/assets/images/tools/reeder.png',
+		image: '/assets/images/tools/webp/reeder.webp',
 	},
 	{
 		name: 'Readwise Reader',
 		url: 'https://readwise.io/read',
-		image: '/assets/images/tools/readwise-reader.png',
+		image: '/assets/images/tools/webp/readwise-reader.webp',
 	},
 	{
 		name: 'Readwise',
 		url: 'https://readwise.io/i/stefan805',
-		image: '/assets/images/tools/readwise.png',
+		image: '/assets/images/tools/webp/readwise.webp',
 	},
 	{
 		name: 'Snipd',
 		url: 'https://www.snipd.com/',
-		image: '/assets/images/tools/snipd.png',
+		image: '/assets/images/tools/webp/snipd.webp',
 	},
 	{
 		name: 'MindNode',
 		url: 'https://www.mindnode.com/',
-		image: '/assets/images/tools/mindnode.png',
+		image: '/assets/images/tools/webp/mindnode.webp',
 	},
 	{
 		name: 'BibDesk',
 		url: 'https://bibdesk.sourceforge.io/',
-		image: '/assets/images/tools/bibdesk.png',
+		image: '/assets/images/tools/webp/bibdesk.webp',
 	},
 ];
 
@@ -127,46 +127,46 @@ export const other = [
 	{
 		name: 'Things',
 		url: 'https://culturedcode.com/things/',
-		image: '/assets/images/tools/things.png',
+		image: '/assets/images/tools/webp/things.webp',
 	},
 	{
 		name: 'Raycast',
 		url: 'https://www.raycast.com/hey/059d78ca',
-		image: '/assets/images/tools/raycast.png',
+		image: '/assets/images/tools/webp/raycast.webp',
 	},
 	{
 		name: 'Arc',
 		url: 'https://arc.net/gift/3a2fd063',
-		image: '/assets/images/tools/arc-browser.png',
+		image: '/assets/images/tools/webp/arc-browser.webp',
 	},
 	{
 		name: 'Brave Browser',
 		url: 'https://brave.com/',
-		image: '/assets/images/tools/brave-browser.png',
+		image: '/assets/images/tools/webp/brave-browser.webp',
 	},
 	{
 		name: 'Proton Mail',
 		url: 'https://proton.me/mail',
-		image: '/assets/images/tools/protonmail.png',
+		image: '/assets/images/tools/webp/protonmail.webp',
 	},
 	{
 		name: 'Proton VPN',
 		url: 'https://protonvpn.com/',
-		image: '/assets/images/tools/protonvpn.png',
+		image: '/assets/images/tools/webp/protonvpn.webp',
 	},
 	{
 		name: 'Proton Pass',
 		url: 'https://proton.me/pass',
-		image: '/assets/images/tools/protonpass.png',
+		image: '/assets/images/tools/webp/protonpass.webp',
 	},
 	{
 		name: 'Yoink',
 		url: 'https://eternalstorms.at/yoink/mac/',
-		image: '/assets/images/tools/yoink.png',
+		image: '/assets/images/tools/webp/yoink.webp',
 	},
 	{
 		name: 'Karabiner-Elements',
 		url: 'https://karabiner-elements.pqrs.org/',
-		image: '/assets/images/tools/karabiner-elements.png',
+		image: '/assets/images/tools/webp/karabiner-elements.webp',
 	},
 ];

src/layouts/AboutLayout.astro

@@ -3,7 +3,7 @@ import { site } from '../data/site';
 
 import GridLayout from './GridLayout.astro';
 import PageTitle from '../components/PageTitle.astro';
-import Picture from '../components/Picture.astro';
+import Image from '../components/Image.astro';
 
 const { frontmatter } = Astro.props;
 const schema = JSON.stringify({
@@ -35,12 +35,7 @@ const schema = JSON.stringify({
 		slot="before-content"
 		class="col-start-1 col-end-12 md:col-start-3 md:col-end-10 xl:col-start-15 xl:col-end-18 xl:row-start-2 xl:-scale-x-100 3xl:col-start-14 3xl:col-end-17"
 	>
-		<Picture
+		<Image alt="Stefan Imhoff" src="/assets/images/ai-portrait-stefan-imhoff.jpg" />
-			alt="Stefan Imhoff"
-			aspect={1}
-			breakpoints={[300, 700, 1000]}
-			src="/assets/images/ai-portrait-stefan-imhoff.jpg"
-		/>
 	</div>
 	<slot />
 	<script type="application/ld+json" set:html={schema} />

src/layouts/PageLayout.astro

@@ -1,6 +1,6 @@
 ---
 import PageTitle from '../components/PageTitle.astro';
-import Picture from '../components/Picture.astro';
+import Image from '../components/Image.astro';
 
 import GridLayout from './GridLayout.astro';
 
@@ -24,12 +24,7 @@ const gridVariant = frontmatter.grid || grid;
 				slot="before-content"
 				class="col-span-full xl:col-start-1 xl:col-end-14 3xl:col-end-13 [&_div]:!border-x-0 [&_div]:!mbe-0 [&_div]:md:!border-s-0"
 			>
-				<Picture
+				<Image alt={frontmatter.title} src={frontmatter.cover} />
-					alt={frontmatter.title}
-					aspect={1.5}
-					breakpoints={[500, 1000, 1500]}
-					src={frontmatter.cover}
-				/>
 			</div>
 		)
 	}

src/mdx-components.ts

@@ -2,7 +2,6 @@ import { YouTube } from '@astro-community/astro-embed-youtube';
 
 import Image from './components/Image.astro';
 import MarkdownImage from './components/MarkdownImage.astro';
-import Picture from './components/Picture.astro';
 import ThemeBox from './components/ThemeBox.astro';
 
 import {
@@ -71,7 +70,6 @@ export const mapping = {
 	OdyseeVideo,
 	ol: OrderedList,
 	p: Text,
-	Picture,
 	PrimeVideoFlag,
 	ProjectIntro,
 	Pullquote,
@@ -102,7 +100,6 @@ export const rssMapping = {
 	MoreLink,
 	NetflixFlag,
 	OdyseeVideo,
-	Picture,
 	PrimeVideoFlag,
 	ProjectIntro,
 	Pullquote,

src/pages/[...slug].astro

@@ -11,7 +11,7 @@ import { dateToFormat, dateToISO, wordCount } from '../utils';
 import GridLayout from '../layouts/GridLayout.astro';
 import PageTitle from '../components/PageTitle.astro';
 import Pagination from '../components/Pagination.astro';
-import Picture from '../components/Picture.astro';
+import Image from '../components/Image.astro';
 import { Banner, ListItem, OrderedList, Tag, TextLink } from '../components';
 
 import { mapping } from '../mdx-components';
@@ -29,7 +29,7 @@ export async function getStaticPaths() {
 				index + 1 === numberOfPages
 					? { slug: null, data: null }
 					: formattedJournalEntries[index + 1],
-			prev: index === 0 ? {} : formattedJournalEntries[index - 1],
+			prev: index === 0 ? { slug: null, data: null } : formattedJournalEntries[index - 1],
 		},
 	}));
 }
@@ -90,12 +90,9 @@ const schema = JSON.stringify({
 	</PageTitle>
 	{
 		entry.data.cover && (
-			<Picture
+			<Image
 				alt={entry.data.title}
-				aspect={1.6}
+				class="col-span-full aspect-video h-auto !mbe-0 xl:col-start-1 xl:col-end-14 3xl:col-end-13 print:hidden [&_img]:!w-full [&_img]:!max-w-none [&_picture]:!w-full [&_picture]:!max-w-none"
-				breakpoints={[500, 1000, 1500]}
-				class="col-span-full aspect-video h-auto !mbe-0 print:hidden xl:col-start-1 xl:col-end-14 3xl:col-end-13 [&_img]:!w-full [&_img]:!max-w-none [&_picture]:!w-full [&_picture]:!max-w-none"
-				format={['avif']}
 				loading="eager"
 				src={entry.data.cover}
 			/>
@@ -165,10 +162,10 @@ const schema = JSON.stringify({
 	</div>
 
 	<Pagination
-		nextText={'Next'}
+		nextText="Next"
-		nextUrl={next.slug && `/${next.slug}/`}
+		nextUrl={next.slug ? `/${next.slug}/` : undefined}
-		previousText={'Next'}
+		previousText="Previous"
-		previousUrl={prev.slug && `/${prev.slug}/`}
+		previousUrl={prev.slug ? `/${prev.slug}/` : undefined}
 	/>
 </GridLayout>
 

src/pages/ai-art.astro

@@ -9,7 +9,7 @@ import { animation } from '../data/site';
 
 import GridLayout from '../layouts/GridLayout.astro';
 import PageTitle from '../components/PageTitle.astro';
-import Picture from '../components/Picture.astro';
+import Image from '../components/Image.astro';
 import { Link } from '../components';
 import { Content as Intro } from '../text/ai-art/intro.mdx';
 
@@ -66,12 +66,9 @@ const description = 'This is a collection of AI art pieces I’ve created with S
 						{...animation}
 					>
 						<Link title={data.title} href={`/ai-art/${slug}/`}>
-							<Picture
+							<Image
 								alt={data.title}
-								aspect={data.images[0].aspectRatio}
-								breakpoints={[500, 1000, 1500]}
 								class="h-full mbe-10 md:w-full md:object-cover md:!mbe-0 [&_img]:!block [&_img]:!h-full [&_img]:border-solid [&_picture]:!block [&_picture]:!h-full"
-								format={['avif']}
 								loading="eager"
 								src={data.images[0].src}
 							/>

src/pages/colophon.mdx

@@ -37,7 +37,6 @@ The source code of this website is available on [GitHub](https://github.com/koga
 - My content is written in [MDX](https://mdxjs.com/), which allows using components in the [Markdown](https://daringfireball.net/projects/markdown/).
 - I use [Tailwind CSS](https://tailwindcss.com/) for my styling and [tailwindcss-logical](https://stevecochrane.github.io/tailwindcss-logical/) to get logical properties.
 - The scroll animations are created with [Sal](https://mciastek.github.io/sal/) and for page transitions I use [Swup](https://swup.js.org/).
-- All images are optimized with [Astro ImageTools](https://github.com/RafidMuhymin/astro-imagetools/).
 - My site search is build with [Pagefind](https://pagefind.app/) using the [Astro-Pagefind](https://github.com/shishkin/astro-pagefind) integration.
 - I use YouTube Lite, provided by [Astro Embed](https://github.com/astro-community/astro-embed).
 - [Astro SEO](https://github.com/jonasmerlin/astro-seo) makes it easy to add the SEO relevant information.

src/pages/index.astro

@@ -8,7 +8,7 @@ import { site, animation, animationDelay } from '../data/site';
 import GridLayout from '../layouts/GridLayout.astro';
 
 import PageTitle from '../components/PageTitle.astro';
-import Picture from '../components/Picture.astro';
+import Image from '../components/Image.astro';
 import JournalList from '../components/JournalList.astro';
 
 /* FIXME: Remove hack as soon as this issue is resolved:
@@ -46,13 +46,7 @@ rssPosts.sort(sortMarkdownByDate);
 	<div
 		class="col-start-1 col-end-19 md:col-start-1 md:col-end-11 xl:col-end-11 [&_div]:!border-x-0 [&_div]:!mbe-0 [&_div]:md:!border-s-0"
 	>
-		<Picture
+		<Image alt="Bonsai" loading="eager" src="/assets/images/cover/bonsai.jpg" />
-			alt="Bonsai"
-			aspect={1.5}
-			breakpoints={[500, 1000, 1500]}
-			loading="eager"
-			src="/assets/images/cover/bonsai.jpg"
-		/>
 	</div>
 
 	<article

src/pages/sketchnotes.astro

@@ -8,7 +8,7 @@ import { animation } from '../data/site';
 
 import GridLayout from '../layouts/GridLayout.astro';
 import PageTitle from '../components/PageTitle.astro';
-import Picture from '../components/Picture.astro';
+import Image from '../components/Image.astro';
 import { Link } from '../components';
 import { Content as Intro } from '../text/sketchnotes/intro.mdx';
 
@@ -25,7 +25,7 @@ const description = 'This is a collection of Sketchnotes I’ve drawn.';
 	<PageTitle grid="wide" innerGrid>Sketchnotes</PageTitle>
 
 	<article
-		class="col-start-1 col-end-17 grid print:block md:col-start-4 md:col-end-12 xl:col-start-5 xl:col-end-11"
+		class="col-start-1 col-end-17 grid md:col-start-4 md:col-end-12 xl:col-start-5 xl:col-end-11 print:block"
 		{...animation}
 	>
 		<Intro components={mapping} />
@@ -37,7 +37,7 @@ const description = 'This is a collection of Sketchnotes I’ve drawn.';
 		data-pagefind-ignore
 	>
 		<ol
-			class="gap-[max(25px,_2vw)] print:block md:grid md:grid-flow-row-dense md:auto-rows-[50px] md:grid-cols-[repeat(auto-fit,_minmax(50px,_1fr))] md:grid-rows-[50px]"
+			class="gap-[max(25px,_2vw)] md:grid md:grid-flow-row-dense md:auto-rows-[50px] md:grid-cols-[repeat(auto-fit,_minmax(50px,_1fr))] md:grid-rows-[50px] print:block"
 		>
 			{
 				allSketchnotes.map(({ slug, data }) => (
@@ -59,12 +59,9 @@ const description = 'This is a collection of Sketchnotes I’ve drawn.';
 						{...animation}
 					>
 						<Link title={data.title} href={`/sketchnotes/${slug}/`}>
-							<Picture
+							<Image
 								alt={data.title}
-								aspect={data.images[0].aspectRatio}
-								breakpoints={[500, 1000, 1500]}
 								class="h-full mbe-10 md:w-full md:object-cover md:!mbe-0 [&_img]:!block [&_img]:!h-full [&_img]:border-solid [&_picture]:!block [&_picture]:!h-full"
-								format={['avif']}
 								loading="eager"
 								src={data.images[0].src}
 							/>

types/astro-imagetools.d.ts

@@ -1 +0,0 @@
-declare module 'astro-imagetools/components';