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

View file

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

View file

@ -1,20 +1,22 @@
<script lang="ts">
import type { Picture } from 'vite-imagetools';
import type { Picture } from 'vite-imagetools';
import type { Snippet } from 'svelte';
import { ExternalLinkType } from '../types/externalLinkType';
import type { ExternalLinkType } from '../types/externalLinkType';
const {
links,
details,
portfolioDetails,
externalLinks,
name,
src,
alt,
style,
fetchpriority = 'auto',
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();
const {
links,
details,
portfolioDetails,
externalLinks,
name,
src,
alt,
style,
fetchpriority = 'auto',
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();
</script>
<div class="portfolio">
@ -24,7 +26,7 @@ const {
{@render links(externalLinks)}
</div>
<div class="portfolio-details">
{@render details()}
{@render details(portfolioDetails)}
</div>
</div>

View file

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