Fixing portfolio rendering using snippets and const for the MD files. Change from MD later as MDSvex is not ideal for this.

This commit is contained in:
Bradley Shellnut 2024-12-03 11:55:16 -08:00
parent e8c6b83a1e
commit 1e32f642da
4 changed files with 126 additions and 121 deletions

View file

@ -41,12 +41,12 @@
"postcss-import": "^16.1.0", "postcss-import": "^16.1.0",
"postcss-load-config": "^5.1.0", "postcss-load-config": "^5.1.0",
"postcss-preset-env": "^9.6.0", "postcss-preset-env": "^9.6.0",
"sass": "^1.81.0", "sass": "^1.81.1",
"satori": "^0.10.14", "satori": "^0.10.14",
"satori-html": "^0.3.2", "satori-html": "^0.3.2",
"scrape-it": "^6.1.3", "scrape-it": "^6.1.3",
"sharp": "^0.33.5", "sharp": "^0.33.5",
"svelte": "^5.3.1", "svelte": "^5.5.0",
"svelte-check": "^4.1.0", "svelte-check": "^4.1.0",
"svelte-meta-tags": "^4.0.4", "svelte-meta-tags": "^4.0.4",
"svelte-preprocess": "^6.0.3", "svelte-preprocess": "^6.0.3",
@ -54,7 +54,7 @@
"tslib": "^2.8.1", "tslib": "^2.8.1",
"typescript": "^5.7.2", "typescript": "^5.7.2",
"vanilla-lazyload": "^19.1.3", "vanilla-lazyload": "^19.1.3",
"vite": "^6.0.1", "vite": "^6.0.2",
"vite-imagetools": "^7.0.5", "vite-imagetools": "^7.0.5",
"vitest": "^1.6.0" "vitest": "^1.6.0"
}, },

View file

@ -13,19 +13,19 @@ importers:
version: 2.6.2 version: 2.6.2
'@sveltejs/adapter-vercel': '@sveltejs/adapter-vercel':
specifier: ^5.5.0 specifier: ^5.5.0
version: 5.5.0(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2))) version: 5.5.0(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))
'@types/nprogress': '@types/nprogress':
specifier: ^0.2.3 specifier: ^0.2.3
version: 0.2.3 version: 0.2.3
'@unpic/svelte': '@unpic/svelte':
specifier: ^0.0.56 specifier: ^0.0.56
version: 0.0.56(svelte@5.3.1) version: 0.0.56(svelte@5.5.0)
'@vercel/og': '@vercel/og':
specifier: ^0.6.4 specifier: ^0.6.4
version: 0.6.4 version: 0.6.4
bits-ui: bits-ui:
specifier: ^0.21.16 specifier: ^0.21.16
version: 0.21.16(svelte@5.3.1) version: 0.21.16(svelte@5.5.0)
flexsearch: flexsearch:
specifier: ^0.7.43 specifier: ^0.7.43
version: 0.7.43 version: 0.7.43
@ -34,13 +34,13 @@ importers:
version: 5.4.1 version: 5.4.1
lucide-svelte: lucide-svelte:
specifier: ^0.462.0 specifier: ^0.462.0
version: 0.462.0(svelte@5.3.1) version: 0.462.0(svelte@5.5.0)
nprogress: nprogress:
specifier: ^0.2.0 specifier: ^0.2.0
version: 0.2.0 version: 0.2.0
svelte-local-storage-store: svelte-local-storage-store:
specifier: ^0.6.4 specifier: ^0.6.4
version: 0.6.4(svelte@5.3.1) version: 0.6.4(svelte@5.5.0)
devDependencies: devDependencies:
'@biomejs/biome': '@biomejs/biome':
specifier: ^1.9.4 specifier: ^1.9.4
@ -59,34 +59,34 @@ importers:
version: 1.2.74 version: 1.2.74
'@melt-ui/pp': '@melt-ui/pp':
specifier: ^0.3.2 specifier: ^0.3.2
version: 0.3.2(@melt-ui/svelte@0.86.2(svelte@5.3.1))(svelte@5.3.1) version: 0.3.2(@melt-ui/svelte@0.86.2(svelte@5.5.0))(svelte@5.5.0)
'@melt-ui/svelte': '@melt-ui/svelte':
specifier: ^0.86.2 specifier: ^0.86.2
version: 0.86.2(svelte@5.3.1) version: 0.86.2(svelte@5.5.0)
'@playwright/test': '@playwright/test':
specifier: ^1.49.0 specifier: ^1.49.0
version: 1.49.0 version: 1.49.0
'@sveltejs/adapter-auto': '@sveltejs/adapter-auto':
specifier: ^3.3.1 specifier: ^3.3.1
version: 3.3.1(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2))) version: 3.3.1(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))
'@sveltejs/adapter-node': '@sveltejs/adapter-node':
specifier: ^5.2.9 specifier: ^5.2.9
version: 5.2.9(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2))) version: 5.2.9(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))
'@sveltejs/adapter-static': '@sveltejs/adapter-static':
specifier: ^3.0.6 specifier: ^3.0.6
version: 3.0.6(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2))) version: 3.0.6(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))
'@sveltejs/enhanced-img': '@sveltejs/enhanced-img':
specifier: ^0.4.1 specifier: ^0.4.1
version: 0.4.1(rollup@4.21.3)(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)) version: 0.4.1(rollup@4.21.3)(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2))
'@sveltejs/kit': '@sveltejs/kit':
specifier: ^2.9.0 specifier: ^2.9.0
version: 2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)) version: 2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2))
'@sveltejs/vite-plugin-svelte': '@sveltejs/vite-plugin-svelte':
specifier: ^5.0.1 specifier: ^5.0.1
version: 5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)) version: 5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2))
'@zerodevx/svelte-img': '@zerodevx/svelte-img':
specifier: ^2.1.2 specifier: ^2.1.2
version: 2.1.2(rollup@4.21.3)(svelte@5.3.1) version: 2.1.2(rollup@4.21.3)(svelte@5.5.0)
autoprefixer: autoprefixer:
specifier: ^10.4.20 specifier: ^10.4.20
version: 10.4.20(postcss@8.4.49) version: 10.4.20(postcss@8.4.49)
@ -98,7 +98,7 @@ importers:
version: 4.3.0 version: 4.3.0
mdsvex: mdsvex:
specifier: ^0.11.2 specifier: ^0.11.2
version: 0.11.2(svelte@5.3.1) version: 0.11.2(svelte@5.5.0)
mdsvex-relative-images: mdsvex-relative-images:
specifier: ^1.0.3 specifier: ^1.0.3
version: 1.0.3 version: 1.0.3
@ -115,8 +115,8 @@ importers:
specifier: ^9.6.0 specifier: ^9.6.0
version: 9.6.0(postcss@8.4.49) version: 9.6.0(postcss@8.4.49)
sass: sass:
specifier: ^1.81.0 specifier: ^1.81.1
version: 1.81.0 version: 1.81.1
satori: satori:
specifier: ^0.10.14 specifier: ^0.10.14
version: 0.10.14 version: 0.10.14
@ -130,17 +130,17 @@ importers:
specifier: ^0.33.5 specifier: ^0.33.5
version: 0.33.5 version: 0.33.5
svelte: svelte:
specifier: ^5.3.1 specifier: ^5.5.0
version: 5.3.1 version: 5.5.0
svelte-check: svelte-check:
specifier: ^4.1.0 specifier: ^4.1.0
version: 4.1.0(picomatch@4.0.2)(svelte@5.3.1)(typescript@5.7.2) version: 4.1.0(picomatch@4.0.2)(svelte@5.5.0)(typescript@5.7.2)
svelte-meta-tags: svelte-meta-tags:
specifier: ^4.0.4 specifier: ^4.0.4
version: 4.0.4(svelte@5.3.1)(typescript@5.7.2) version: 4.0.4(svelte@5.5.0)(typescript@5.7.2)
svelte-preprocess: svelte-preprocess:
specifier: ^6.0.3 specifier: ^6.0.3
version: 6.0.3(postcss-load-config@5.1.0(postcss@8.4.49))(postcss@8.4.49)(sass@1.81.0)(svelte@5.3.1)(typescript@5.7.2) version: 6.0.3(postcss-load-config@5.1.0(postcss@8.4.49))(postcss@8.4.49)(sass@1.81.1)(svelte@5.5.0)(typescript@5.7.2)
svelte-sequential-preprocessor: svelte-sequential-preprocessor:
specifier: ^2.0.2 specifier: ^2.0.2
version: 2.0.2 version: 2.0.2
@ -154,14 +154,14 @@ importers:
specifier: ^19.1.3 specifier: ^19.1.3
version: 19.1.3 version: 19.1.3
vite: vite:
specifier: ^6.0.1 specifier: ^6.0.2
version: 6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2) version: 6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)
vite-imagetools: vite-imagetools:
specifier: ^7.0.5 specifier: ^7.0.5
version: 7.0.5(rollup@4.21.3) version: 7.0.5(rollup@4.21.3)
vitest: vitest:
specifier: ^1.6.0 specifier: ^1.6.0
version: 1.6.0(@types/node@20.7.0)(sass@1.81.0) version: 1.6.0(@types/node@20.7.0)(sass@1.81.1)
packages: packages:
@ -2533,8 +2533,8 @@ packages:
safer-buffer@2.1.2: safer-buffer@2.1.2:
resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==} resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==}
sass@1.81.0: sass@1.81.1:
resolution: {integrity: sha512-Q4fOxRfhmv3sqCLoGfvrC9pRV8btc0UtqL9mN6Yrv6Qi9ScL55CVH1vlPP863ISLEEMNLLuu9P+enCeGHlnzhA==} resolution: {integrity: sha512-VNLgf4FC5yFyKwAumAAwwNh8X4SevlVREq3Y8aDZIkm0lI/zO1feycMXQ4hn+eB6FVhRbleSQ1Yb/q8juSldTA==}
engines: {node: '>=14.0.0'} engines: {node: '>=14.0.0'}
hasBin: true hasBin: true
@ -2721,8 +2721,8 @@ packages:
resolution: {integrity: sha512-IY1rnGr6izd10B0A8LqsBfmlT5OILVuZ7XsI0vdGPEvuonFV7NYEUK4dAkm9Zg2q0Um92kYjTpS1CAP3Nh/KWw==} resolution: {integrity: sha512-IY1rnGr6izd10B0A8LqsBfmlT5OILVuZ7XsI0vdGPEvuonFV7NYEUK4dAkm9Zg2q0Um92kYjTpS1CAP3Nh/KWw==}
engines: {node: '>=16'} engines: {node: '>=16'}
svelte@5.3.1: svelte@5.5.0:
resolution: {integrity: sha512-Y6PXppQhIZZ0HLZKj6UMV/VZPJbHiK98K8A5M7mJ+PGrz4erUmuDRUa8l7aw4La++Vl51YWzLUuuB0FZ7JPfnw==} resolution: {integrity: sha512-yr3M6RYUPUOadCQCA35Tgg5Rt9y8SkqUyVhuobTEEKQWAO945Zj4nYxBs+3xv0gdpuZNdUfAE8vcg3zUg51rZw==}
engines: {node: '>=18'} engines: {node: '>=18'}
tabbable@6.2.0: tabbable@6.2.0:
@ -2865,8 +2865,8 @@ packages:
terser: terser:
optional: true optional: true
vite@6.0.1: vite@6.0.2:
resolution: {integrity: sha512-Ldn6gorLGr4mCdFnmeAOLweJxZ34HjKnDm4HGo6P66IEqTxQb36VEdFJQENKxWjupNfoIjvRUnswjn1hpYEpjQ==} resolution: {integrity: sha512-XdQ+VsY2tJpBsKGs0wf3U/+azx8BBpYRHFAyKm5VeEZNOJZRB63q7Sc8Iup3k0TrN3KO6QgyzFf+opSbfY1y0g==}
engines: {node: ^18.0.0 || ^20.0.0 || >=22.0.0} engines: {node: ^18.0.0 || ^20.0.0 || >=22.0.0}
hasBin: true hasBin: true
peerDependencies: peerDependencies:
@ -3560,14 +3560,14 @@ snapshots:
- encoding - encoding
- supports-color - supports-color
'@melt-ui/pp@0.3.2(@melt-ui/svelte@0.86.2(svelte@5.3.1))(svelte@5.3.1)': '@melt-ui/pp@0.3.2(@melt-ui/svelte@0.86.2(svelte@5.5.0))(svelte@5.5.0)':
dependencies: dependencies:
'@melt-ui/svelte': 0.86.2(svelte@5.3.1) '@melt-ui/svelte': 0.86.2(svelte@5.5.0)
estree-walker: 3.0.3 estree-walker: 3.0.3
magic-string: 0.30.14 magic-string: 0.30.14
svelte: 5.3.1 svelte: 5.5.0
'@melt-ui/svelte@0.76.2(svelte@5.3.1)': '@melt-ui/svelte@0.76.2(svelte@5.5.0)':
dependencies: dependencies:
'@floating-ui/core': 1.6.0 '@floating-ui/core': 1.6.0
'@floating-ui/dom': 1.6.3 '@floating-ui/dom': 1.6.3
@ -3575,9 +3575,9 @@ snapshots:
dequal: 2.0.3 dequal: 2.0.3
focus-trap: 7.5.4 focus-trap: 7.5.4
nanoid: 5.0.7 nanoid: 5.0.7
svelte: 5.3.1 svelte: 5.5.0
'@melt-ui/svelte@0.86.2(svelte@5.3.1)': '@melt-ui/svelte@0.86.2(svelte@5.5.0)':
dependencies: dependencies:
'@floating-ui/core': 1.6.0 '@floating-ui/core': 1.6.0
'@floating-ui/dom': 1.6.3 '@floating-ui/dom': 1.6.3
@ -3585,7 +3585,7 @@ snapshots:
dequal: 2.0.3 dequal: 2.0.3
focus-trap: 7.5.4 focus-trap: 7.5.4
nanoid: 5.0.7 nanoid: 5.0.7
svelte: 5.3.1 svelte: 5.5.0
'@parcel/watcher-android-arm64@2.5.0': '@parcel/watcher-android-arm64@2.5.0':
optional: true optional: true
@ -3865,46 +3865,46 @@ snapshots:
'@sinclair/typebox@0.27.8': {} '@sinclair/typebox@0.27.8': {}
'@sveltejs/adapter-auto@3.3.1(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))': '@sveltejs/adapter-auto@3.3.1(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))':
dependencies: dependencies:
'@sveltejs/kit': 2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)) '@sveltejs/kit': 2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2))
import-meta-resolve: 4.1.0 import-meta-resolve: 4.1.0
'@sveltejs/adapter-node@5.2.9(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))': '@sveltejs/adapter-node@5.2.9(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))':
dependencies: dependencies:
'@rollup/plugin-commonjs': 28.0.1(rollup@4.21.3) '@rollup/plugin-commonjs': 28.0.1(rollup@4.21.3)
'@rollup/plugin-json': 6.1.0(rollup@4.21.3) '@rollup/plugin-json': 6.1.0(rollup@4.21.3)
'@rollup/plugin-node-resolve': 15.3.0(rollup@4.21.3) '@rollup/plugin-node-resolve': 15.3.0(rollup@4.21.3)
'@sveltejs/kit': 2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)) '@sveltejs/kit': 2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2))
rollup: 4.21.3 rollup: 4.21.3
'@sveltejs/adapter-static@3.0.6(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))': '@sveltejs/adapter-static@3.0.6(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))':
dependencies: dependencies:
'@sveltejs/kit': 2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)) '@sveltejs/kit': 2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2))
'@sveltejs/adapter-vercel@5.5.0(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))': '@sveltejs/adapter-vercel@5.5.0(@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))':
dependencies: dependencies:
'@sveltejs/kit': 2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)) '@sveltejs/kit': 2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2))
'@vercel/nft': 0.27.1 '@vercel/nft': 0.27.1
esbuild: 0.24.0 esbuild: 0.24.0
transitivePeerDependencies: transitivePeerDependencies:
- encoding - encoding
- supports-color - supports-color
'@sveltejs/enhanced-img@0.4.1(rollup@4.21.3)(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2))': '@sveltejs/enhanced-img@0.4.1(rollup@4.21.3)(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2))':
dependencies: dependencies:
magic-string: 0.30.14 magic-string: 0.30.14
svelte: 5.3.1 svelte: 5.5.0
svelte-parse-markup: 0.1.5(svelte@5.3.1) svelte-parse-markup: 0.1.5(svelte@5.5.0)
vite: 6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2) vite: 6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)
vite-imagetools: 7.0.5(rollup@4.21.3) vite-imagetools: 7.0.5(rollup@4.21.3)
zimmerframe: 1.1.2 zimmerframe: 1.1.2
transitivePeerDependencies: transitivePeerDependencies:
- rollup - rollup
'@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2))': '@sveltejs/kit@2.9.0(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2))':
dependencies: dependencies:
'@sveltejs/vite-plugin-svelte': 5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)) '@sveltejs/vite-plugin-svelte': 5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2))
'@types/cookie': 0.6.0 '@types/cookie': 0.6.0
cookie: 0.6.0 cookie: 0.6.0
devalue: 5.1.1 devalue: 5.1.1
@ -3916,29 +3916,29 @@ snapshots:
sade: 1.8.1 sade: 1.8.1
set-cookie-parser: 2.6.0 set-cookie-parser: 2.6.0
sirv: 3.0.0 sirv: 3.0.0
svelte: 5.3.1 svelte: 5.5.0
tiny-glob: 0.2.9 tiny-glob: 0.2.9
vite: 6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2) vite: 6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)
'@sveltejs/vite-plugin-svelte-inspector@4.0.1(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2))': '@sveltejs/vite-plugin-svelte-inspector@4.0.1(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2))':
dependencies: dependencies:
'@sveltejs/vite-plugin-svelte': 5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)) '@sveltejs/vite-plugin-svelte': 5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2))
debug: 4.3.7 debug: 4.3.7
svelte: 5.3.1 svelte: 5.5.0
vite: 6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2) vite: 6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)
transitivePeerDependencies: transitivePeerDependencies:
- supports-color - supports-color
'@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2))': '@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2))':
dependencies: dependencies:
'@sveltejs/vite-plugin-svelte-inspector': 4.0.1(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)))(svelte@5.3.1)(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)) '@sveltejs/vite-plugin-svelte-inspector': 4.0.1(@sveltejs/vite-plugin-svelte@5.0.1(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)))(svelte@5.5.0)(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2))
debug: 4.3.7 debug: 4.3.7
deepmerge: 4.3.1 deepmerge: 4.3.1
kleur: 4.1.5 kleur: 4.1.5
magic-string: 0.30.14 magic-string: 0.30.14
svelte: 5.3.1 svelte: 5.5.0
vite: 6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2) vite: 6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)
vitefu: 1.0.4(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)) vitefu: 1.0.4(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2))
transitivePeerDependencies: transitivePeerDependencies:
- supports-color - supports-color
@ -3965,11 +3965,11 @@ snapshots:
dependencies: dependencies:
unpic: 3.20.0 unpic: 3.20.0
'@unpic/svelte@0.0.56(svelte@5.3.1)': '@unpic/svelte@0.0.56(svelte@5.5.0)':
dependencies: dependencies:
'@unpic/core': 0.0.52 '@unpic/core': 0.0.52
style-object-to-css-string: 1.1.3 style-object-to-css-string: 1.1.3
svelte: 5.3.1 svelte: 5.5.0
unpic: 3.20.0 unpic: 3.20.0
'@vercel/nft@0.27.1': '@vercel/nft@0.27.1':
@ -4025,9 +4025,9 @@ snapshots:
loupe: 2.3.7 loupe: 2.3.7
pretty-format: 29.7.0 pretty-format: 29.7.0
'@zerodevx/svelte-img@2.1.2(rollup@4.21.3)(svelte@5.3.1)': '@zerodevx/svelte-img@2.1.2(rollup@4.21.3)(svelte@5.5.0)':
dependencies: dependencies:
svelte: 5.3.1 svelte: 5.5.0
vite-imagetools: 6.2.9(rollup@4.21.3) vite-imagetools: 6.2.9(rollup@4.21.3)
transitivePeerDependencies: transitivePeerDependencies:
- rollup - rollup
@ -4120,12 +4120,12 @@ snapshots:
dependencies: dependencies:
file-uri-to-path: 1.0.0 file-uri-to-path: 1.0.0
bits-ui@0.21.16(svelte@5.3.1): bits-ui@0.21.16(svelte@5.5.0):
dependencies: dependencies:
'@internationalized/date': 3.5.2 '@internationalized/date': 3.5.2
'@melt-ui/svelte': 0.76.2(svelte@5.3.1) '@melt-ui/svelte': 0.76.2(svelte@5.5.0)
nanoid: 5.0.7 nanoid: 5.0.7
svelte: 5.3.1 svelte: 5.5.0
boolbase@1.0.0: {} boolbase@1.0.0: {}
@ -4668,9 +4668,9 @@ snapshots:
dependencies: dependencies:
get-func-name: 2.0.2 get-func-name: 2.0.2
lucide-svelte@0.462.0(svelte@5.3.1): lucide-svelte@0.462.0(svelte@5.5.0):
dependencies: dependencies:
svelte: 5.3.1 svelte: 5.5.0
magic-string@0.30.14: magic-string@0.30.14:
dependencies: dependencies:
@ -4691,12 +4691,12 @@ snapshots:
just-camel-case: 4.0.2 just-camel-case: 4.0.2
unist-util-visit: 3.1.0 unist-util-visit: 3.1.0
mdsvex@0.11.2(svelte@5.3.1): mdsvex@0.11.2(svelte@5.5.0):
dependencies: dependencies:
'@types/unist': 2.0.6 '@types/unist': 2.0.6
prism-svelte: 0.4.7 prism-svelte: 0.4.7
prismjs: 1.29.0 prismjs: 1.29.0
svelte: 5.3.1 svelte: 5.5.0
vfile-message: 2.0.4 vfile-message: 2.0.4
merge-stream@2.0.0: {} merge-stream@2.0.0: {}
@ -5211,7 +5211,7 @@ snapshots:
safer-buffer@2.1.2: {} safer-buffer@2.1.2: {}
sass@1.81.0: sass@1.81.1:
dependencies: dependencies:
chokidar: 4.0.0 chokidar: 4.0.0
immutable: 5.0.3 immutable: 5.0.3
@ -5367,40 +5367,40 @@ snapshots:
supports-preserve-symlinks-flag@1.0.0: {} supports-preserve-symlinks-flag@1.0.0: {}
svelte-check@4.1.0(picomatch@4.0.2)(svelte@5.3.1)(typescript@5.7.2): svelte-check@4.1.0(picomatch@4.0.2)(svelte@5.5.0)(typescript@5.7.2):
dependencies: dependencies:
'@jridgewell/trace-mapping': 0.3.25 '@jridgewell/trace-mapping': 0.3.25
chokidar: 4.0.1 chokidar: 4.0.1
fdir: 6.4.2(picomatch@4.0.2) fdir: 6.4.2(picomatch@4.0.2)
picocolors: 1.1.1 picocolors: 1.1.1
sade: 1.8.1 sade: 1.8.1
svelte: 5.3.1 svelte: 5.5.0
typescript: 5.7.2 typescript: 5.7.2
transitivePeerDependencies: transitivePeerDependencies:
- picomatch - picomatch
svelte-local-storage-store@0.6.4(svelte@5.3.1): svelte-local-storage-store@0.6.4(svelte@5.5.0):
dependencies: dependencies:
svelte: 5.3.1 svelte: 5.5.0
svelte-meta-tags@4.0.4(svelte@5.3.1)(typescript@5.7.2): svelte-meta-tags@4.0.4(svelte@5.5.0)(typescript@5.7.2):
dependencies: dependencies:
schema-dts: 1.1.2(typescript@5.7.2) schema-dts: 1.1.2(typescript@5.7.2)
svelte: 5.3.1 svelte: 5.5.0
transitivePeerDependencies: transitivePeerDependencies:
- typescript - typescript
svelte-parse-markup@0.1.5(svelte@5.3.1): svelte-parse-markup@0.1.5(svelte@5.5.0):
dependencies: dependencies:
svelte: 5.3.1 svelte: 5.5.0
svelte-preprocess@6.0.3(postcss-load-config@5.1.0(postcss@8.4.49))(postcss@8.4.49)(sass@1.81.0)(svelte@5.3.1)(typescript@5.7.2): svelte-preprocess@6.0.3(postcss-load-config@5.1.0(postcss@8.4.49))(postcss@8.4.49)(sass@1.81.1)(svelte@5.5.0)(typescript@5.7.2):
dependencies: dependencies:
svelte: 5.3.1 svelte: 5.5.0
optionalDependencies: optionalDependencies:
postcss: 8.4.49 postcss: 8.4.49
postcss-load-config: 5.1.0(postcss@8.4.49) postcss-load-config: 5.1.0(postcss@8.4.49)
sass: 1.81.0 sass: 1.81.1
typescript: 5.7.2 typescript: 5.7.2
svelte-sequential-preprocessor@2.0.2: svelte-sequential-preprocessor@2.0.2:
@ -5425,7 +5425,7 @@ snapshots:
magic-string: 0.30.9 magic-string: 0.30.9
periscopic: 3.1.0 periscopic: 3.1.0
svelte@5.3.1: svelte@5.5.0:
dependencies: dependencies:
'@ampproject/remapping': 2.3.0 '@ampproject/remapping': 2.3.0
'@jridgewell/sourcemap-codec': 1.5.0 '@jridgewell/sourcemap-codec': 1.5.0
@ -5545,13 +5545,13 @@ snapshots:
transitivePeerDependencies: transitivePeerDependencies:
- rollup - rollup
vite-node@1.6.0(@types/node@20.7.0)(sass@1.81.0): vite-node@1.6.0(@types/node@20.7.0)(sass@1.81.1):
dependencies: dependencies:
cac: 6.7.14 cac: 6.7.14
debug: 4.3.4 debug: 4.3.4
pathe: 1.1.2 pathe: 1.1.2
picocolors: 1.0.0 picocolors: 1.0.0
vite: 5.4.11(@types/node@20.7.0)(sass@1.81.0) vite: 5.4.11(@types/node@20.7.0)(sass@1.81.1)
transitivePeerDependencies: transitivePeerDependencies:
- '@types/node' - '@types/node'
- less - less
@ -5563,7 +5563,7 @@ snapshots:
- supports-color - supports-color
- terser - terser
vite@5.4.11(@types/node@20.7.0)(sass@1.81.0): vite@5.4.11(@types/node@20.7.0)(sass@1.81.1):
dependencies: dependencies:
esbuild: 0.21.5 esbuild: 0.21.5
postcss: 8.4.49 postcss: 8.4.49
@ -5571,9 +5571,9 @@ snapshots:
optionalDependencies: optionalDependencies:
'@types/node': 20.7.0 '@types/node': 20.7.0
fsevents: 2.3.3 fsevents: 2.3.3
sass: 1.81.0 sass: 1.81.1
vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2): vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2):
dependencies: dependencies:
esbuild: 0.24.0 esbuild: 0.24.0
postcss: 8.4.49 postcss: 8.4.49
@ -5581,14 +5581,14 @@ snapshots:
optionalDependencies: optionalDependencies:
'@types/node': 20.7.0 '@types/node': 20.7.0
fsevents: 2.3.3 fsevents: 2.3.3
sass: 1.81.0 sass: 1.81.1
yaml: 2.4.2 yaml: 2.4.2
vitefu@1.0.4(vite@6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2)): vitefu@1.0.4(vite@6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)):
optionalDependencies: optionalDependencies:
vite: 6.0.1(@types/node@20.7.0)(sass@1.81.0)(yaml@2.4.2) vite: 6.0.2(@types/node@20.7.0)(sass@1.81.1)(yaml@2.4.2)
vitest@1.6.0(@types/node@20.7.0)(sass@1.81.0): vitest@1.6.0(@types/node@20.7.0)(sass@1.81.1):
dependencies: dependencies:
'@vitest/expect': 1.6.0 '@vitest/expect': 1.6.0
'@vitest/runner': 1.6.0 '@vitest/runner': 1.6.0
@ -5607,8 +5607,8 @@ snapshots:
strip-literal: 2.1.0 strip-literal: 2.1.0
tinybench: 2.7.0 tinybench: 2.7.0
tinypool: 0.8.4 tinypool: 0.8.4
vite: 5.4.11(@types/node@20.7.0)(sass@1.81.0) vite: 5.4.11(@types/node@20.7.0)(sass@1.81.1)
vite-node: 1.6.0(@types/node@20.7.0)(sass@1.81.0) vite-node: 1.6.0(@types/node@20.7.0)(sass@1.81.1)
why-is-node-running: 2.2.2 why-is-node-running: 2.2.2
optionalDependencies: optionalDependencies:
'@types/node': 20.7.0 '@types/node': 20.7.0

View file

@ -1,20 +1,22 @@
<script lang="ts"> <script lang="ts">
import type { Picture } from 'vite-imagetools'; import type { Picture } from 'vite-imagetools';
import type { Snippet } from 'svelte'; import type { Snippet } from 'svelte';
import { ExternalLinkType } from '../types/externalLinkType'; import type { ExternalLinkType } from '../types/externalLinkType';
const { const {
links, links,
details, details,
portfolioDetails, portfolioDetails,
externalLinks, externalLinks,
name, name,
src, src,
alt, alt,
style, style,
fetchpriority = 'auto', fetchpriority = 'auto',
loading = 'lazy', loading = 'lazy',
}: { links: Snippet<ExternalLinkType[]>, details: Snippet<string>, portfolioDetails: string, externalLinks: ExternalLinkType[], name: string; src: string | Picture; alt: string; style: string; fetchpriority?: 'high' | 'low' | 'auto'; loading?: 'lazy' | 'eager' } = $props(); }: { links: Snippet<ExternalLinkType[]>, details: Snippet<string>, portfolioDetails: string,
externalLinks: ExternalLinkType[], name: string; src: string | Picture; alt: string;
style: string; fetchpriority?: 'high' | 'low' | 'auto'; loading?: 'lazy' | 'eager' } = $props();
</script> </script>
<div class="portfolio"> <div class="portfolio">
@ -24,7 +26,7 @@ const {
{@render links(externalLinks)} {@render links(externalLinks)}
</div> </div>
<div class="portfolio-details"> <div class="portfolio-details">
{@render details()} {@render details(portfolioDetails)}
</div> </div>
</div> </div>

View file

@ -44,8 +44,9 @@ const triggers = [
</span> </span>
{/snippet} {/snippet}
{#snippet details(portfolioDetails: string)} {#snippet details(portfolioDetails)}
{portfolioDetails} {@const PortfolioDetails = portfolioDetails}
<PortfolioDetails />
{/snippet} {/snippet}
<h1>Portfolio!</h1> <h1>Portfolio!</h1>
@ -53,7 +54,7 @@ const triggers = [
<div use:melt={$list} aria-label="tabs portfolios" class="list tab-list"> <div use:melt={$list} aria-label="tabs portfolios" class="list tab-list">
{#each triggers as triggerItem} {#each triggers as triggerItem}
<button use:melt={$trigger(triggerItem.id)} class="trigger" type="button"> <button use:melt={$trigger(triggerItem.id)} class="trigger" type="button">
<h2>{triggerItem.title}</h2> <span>{triggerItem.title}</span>
</button> </button>
{/each} {/each}
</div> </div>
@ -125,14 +126,16 @@ const triggers = [
} }
.trigger { .trigger {
font-size: var(--h2);
&[data-state='active'] { &[data-state='active'] {
h2 { span {
border-bottom: 2px solid var(--shellYellow); border-bottom: 2px solid var(--shellYellow);
} }
} }
&[data-state='inactive'] { &[data-state='inactive'] {
h2 { span {
border-bottom: 2px solid var(--white); border-bottom: 2px solid var(--white);
} }
} }