From 967ad59394b54f4e1c14e852d17e7c17d402e43f Mon Sep 17 00:00:00 2001 From: Henrique Ramos Date: Mon, 3 Feb 2025 17:05:45 -0300 Subject: [PATCH] chore: add Svelte island to flexbox slide --- astro.config.mjs | 6 +- package.json | 5 +- pnpm-lock.yaml | 246 +++++++++++++++++- src/layouts/SlideLayout.astro | 24 +- src/pages/index.astro | 4 +- .../flexbox/components/CSSPropertyDemo.svelte | 107 ++++++++ src/slides/flexbox/index.astro | 87 ++----- src/theme/variables.css | 5 +- src/utils/getAstroPages.ts | 30 +-- src/utils/getSlides.ts | 1 + svelte.config.js | 5 + 11 files changed, 403 insertions(+), 117 deletions(-) create mode 100644 src/slides/flexbox/components/CSSPropertyDemo.svelte create mode 100644 svelte.config.js diff --git a/astro.config.mjs b/astro.config.mjs index e762ba5..1d02b15 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -1,5 +1,9 @@ // @ts-check import { defineConfig } from 'astro/config'; +import svelte from '@astrojs/svelte'; + // https://astro.build/config -export default defineConfig({}); +export default defineConfig({ + integrations: [svelte()] +}); \ No newline at end of file diff --git a/package.json b/package.json index 484b12c..75beec6 100644 --- a/package.json +++ b/package.json @@ -9,8 +9,11 @@ "astro": "astro" }, "dependencies": { + "@astrojs/svelte": "^7.0.4", "astro": "^5.2.3", - "reveal.js": "^5.1.0" + "reveal.js": "^5.1.0", + "svelte": "^5.19.7", + "typescript": "^5.7.3" }, "devDependencies": { "@biomejs/biome": "^1.9.4", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 42f82e2..54c27fa 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -8,12 +8,21 @@ importers: .: dependencies: + '@astrojs/svelte': + specifier: ^7.0.4 + version: 7.0.4(astro@5.2.3(rollup@4.28.1)(sass@1.83.0)(typescript@5.7.3))(sass@1.83.0)(svelte@5.19.7)(typescript@5.7.3) astro: specifier: ^5.2.3 - version: 5.2.3(rollup@4.28.1)(sass@1.83.0)(typescript@5.7.2) + version: 5.2.3(rollup@4.28.1)(sass@1.83.0)(typescript@5.7.3) reveal.js: specifier: ^5.1.0 version: 5.1.0 + svelte: + specifier: ^5.19.7 + version: 5.19.7 + typescript: + specifier: ^5.7.3 + version: 5.7.3 devDependencies: '@biomejs/biome': specifier: ^1.9.4 @@ -27,6 +36,10 @@ importers: packages: + '@ampproject/remapping@2.3.0': + resolution: {integrity: sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==} + engines: {node: '>=6.0.0'} + '@ark/schema@0.39.0': resolution: {integrity: sha512-LQbQUb3Sj461LgklXObAyUJNtsUUCBxZlO2HqRLYvRSqpStm0xTMrXn51DwBNNxeSULvKVpXFwoxiSec9kwKww==} @@ -46,6 +59,14 @@ packages: resolution: {integrity: sha512-GilTHKGCW6HMq7y3BUv9Ac7GMe/MO9gi9GW62GzKtth0SwukCu/qp2wLiGpEujhY+VVhaG9v7kv/5vFzvf4NYw==} engines: {node: ^18.17.1 || ^20.3.0 || >=22.0.0} + '@astrojs/svelte@7.0.4': + resolution: {integrity: sha512-vTFhHhYNr1GkrpR63Talv8ba1HHUWoHNzBs4eJNZz4bQCihAdxw+xz/CWcWM1bfAzH3Jfc7jAKXPNAZSwN4oFg==} + engines: {node: ^18.17.1 || ^20.3.0 || >=22.0.0} + peerDependencies: + astro: ^5.0.0 + svelte: ^5.1.16 + typescript: ^5.3.3 + '@astrojs/telemetry@3.2.0': resolution: {integrity: sha512-wxhSKRfKugLwLlr4OFfcqovk+LIFtKwLyGPqMsv+9/ibqqnW3Gv7tBhtKEb0gAyUAC4G9BTVQeQahqnQAhd6IQ==} engines: {node: ^18.17.1 || ^20.3.0 || >=22.0.0} @@ -378,9 +399,24 @@ packages: cpu: [x64] os: [win32] + '@jridgewell/gen-mapping@0.3.8': + resolution: {integrity: sha512-imAbBGkb+ebQyxKgzv5Hu2nmROxoDOXHh80evxdoXNOrvAnVx7zimzc1Oo5h9RlfV4vPXaE2iM5pOFbvOCClWA==} + engines: {node: '>=6.0.0'} + + '@jridgewell/resolve-uri@3.1.2': + resolution: {integrity: sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==} + engines: {node: '>=6.0.0'} + + '@jridgewell/set-array@1.2.1': + resolution: {integrity: sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==} + engines: {node: '>=6.0.0'} + '@jridgewell/sourcemap-codec@1.5.0': resolution: {integrity: sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==} + '@jridgewell/trace-mapping@0.3.25': + resolution: {integrity: sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==} + '@nodelib/fs.scandir@2.1.5': resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==} engines: {node: '>= 8'} @@ -603,6 +639,21 @@ packages: '@shikijs/vscode-textmate@10.0.1': resolution: {integrity: sha512-fTIQwLF+Qhuws31iw7Ncl1R3HUDtGwIipiJ9iU+UsDUwMhegFcQKQHd51nZjb7CArq0MvON8rbgCGQYWHUKAdg==} + '@sveltejs/vite-plugin-svelte-inspector@4.0.1': + resolution: {integrity: sha512-J/Nmb2Q2y7mck2hyCX4ckVHcR5tu2J+MtBEQqpDrrgELZ2uvraQcK/ioCV61AqkdXFgriksOKIceDcQmqnGhVw==} + engines: {node: ^18.0.0 || ^20.0.0 || >=22} + peerDependencies: + '@sveltejs/vite-plugin-svelte': ^5.0.0 + svelte: ^5.0.0 + vite: ^6.0.0 + + '@sveltejs/vite-plugin-svelte@5.0.3': + resolution: {integrity: sha512-MCFS6CrQDu1yGwspm4qtli0e63vaPCehf6V7pIMP15AsWgMKrqDGCPFF/0kn4SP0ii4aySu4Pa62+fIRGFMjgw==} + engines: {node: ^18.0.0 || ^20.0.0 || >=22} + peerDependencies: + svelte: ^5.0.0 + vite: ^6.0.0 + '@types/cookie@0.6.0': resolution: {integrity: sha512-4Kh9a6B2bQciAhf7FSuMRRkUWecJgJu9nPnx3yzpsfXX/c50REIqpHY4C82bXP90qrLtXtkDxTZosYO3UpOwlA==} @@ -633,6 +684,11 @@ packages: '@ungap/structured-clone@1.2.1': resolution: {integrity: sha512-fEzPV3hSkSMltkw152tJKNARhOupqbH96MZWyRjNaYZOMIzbrTeQDG+MTc6Mr2pgzFQzFxAfmhGDNP5QK++2ZA==} + acorn-typescript@1.4.13: + resolution: {integrity: sha512-xsc9Xv0xlVfwp2o7sQ+GCQ1PgbkdcpWdTzrwXxO3xDMTAywVS3oXVOcOHuRjAPkS4P9b+yc/qNF15460v+jp4Q==} + peerDependencies: + acorn: '>=8.9.0' + acorn@8.14.0: resolution: {integrity: sha512-cl669nCJTZBsL97OF4kUQm5g5hC2uihk0NxY3WENAC0TYdILVkAyHymAntgxGkl7K+t0cXIrH5siy5S4XkFycA==} engines: {node: '>=0.4.0'} @@ -791,6 +847,13 @@ packages: decode-named-character-reference@1.0.2: resolution: {integrity: sha512-O8x12RzrUF8xyVcY0KJowWsmaJxQbmy0/EtnNtHRpsOcT7dFk5W598coHqBVpmWo1oQQfsCqfCmkZN5DJrZVdg==} + dedent-js@1.0.1: + resolution: {integrity: sha512-OUepMozQULMLUmhxS95Vudo0jb0UchLimi3+pQ2plj61Fcy8axbP9hbiD4Sz6DPqn6XG3kfmziVfQ1rSys5AJQ==} + + deepmerge@4.3.1: + resolution: {integrity: sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==} + engines: {node: '>=0.10.0'} + defu@6.1.4: resolution: {integrity: sha512-mEQCMmwJu317oSz8CwdIOdwf3xMif1ttiM8LTufzc3g6kR+9Pe236twL8j3IYT1F7GfRgGcW6MWxzZjLIkuHIg==} @@ -856,11 +919,17 @@ packages: resolution: {integrity: sha512-/veY75JbMK4j1yjvuUxuVsiS/hr/4iHs9FTT6cgTexxdE0Ly/glccBAkloH/DofkjRbZU3bnoj38mOmhkZ0lHw==} engines: {node: '>=12'} + esm-env@1.2.2: + resolution: {integrity: sha512-Epxrv+Nr/CaL4ZcFGPJIYLWFom+YeV1DqMLHJoEd9SYRxNbaFruBwfEX/kkHUJf55j2+TUbmDcmuilbP1TmXHA==} + esprima@4.0.1: resolution: {integrity: sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==} engines: {node: '>=4'} hasBin: true + esrap@1.4.3: + resolution: {integrity: sha512-Xddc1RsoFJ4z9nR7W7BFaEPIp4UXoeQ0+077UdWLxbafMQFyU79sQJMk7kxNgRwQ9/aVgaKacCHC2pUACGwmYw==} + estree-walker@2.0.2: resolution: {integrity: sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==} @@ -1006,6 +1075,9 @@ packages: resolution: {integrity: sha512-+Pgi+vMuUNkJyExiMBt5IlFoMyKnr5zhJ4Uspz58WOhBF5QoIZkFyNHIbBAtHwzVAgk5RtndVNsDRN61/mmDqg==} engines: {node: '>=12'} + is-reference@3.0.3: + resolution: {integrity: sha512-ixkJoqQvAP88E6wLydLGGqCJsrFUnqoH6HnaczB8XmDH1oaWU+xxdptvikTgaEhtZ53Ky6YXiBuUI2WXLMCwjw==} + is-wsl@3.1.0: resolution: {integrity: sha512-UcVfVfaK4Sc4m7X3dUSoHoozQGBEFeDC+zVo06t98xe8CzHSZZBekNXH+tu0NalHolcJ/QAGqS46Hef7QXBIMw==} engines: {node: '>=16'} @@ -1030,6 +1102,9 @@ packages: resolution: {integrity: sha512-OfCBkGEw4nN6JLtgRidPX6QxjBQGQf72q3si2uvqyFEMbycSFFHwAZeXx6cJgFM9wmLrf9zBwCP3Ivqa+LLZPw==} engines: {node: '>=6'} + locate-character@3.0.0: + resolution: {integrity: sha512-SW13ws7BjaeJ6p7Q6CO2nchbYEc3X3J6WrmTTDto7yMPqVSZTUyY5Tjbid+Ab8gLnATtygYtiDIJGQRRn2ZOiA==} + locate-path@5.0.0: resolution: {integrity: sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==} engines: {node: '>=8'} @@ -1037,6 +1112,9 @@ packages: longest-streak@3.1.0: resolution: {integrity: sha512-9Ri+o0JYgehTaVBBDoMqIl8GXtbWg711O3srftcHhZ0dqnETqLaoIK0x17fUw9rFSlK/0NlsKe0Ahhyl5pXE2g==} + lower-case@2.0.2: + resolution: {integrity: sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==} + lru-cache@10.4.3: resolution: {integrity: sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==} @@ -1204,6 +1282,9 @@ packages: nlcst-to-string@4.0.0: resolution: {integrity: sha512-YKLBCcUYKAg0FNlOBT6aI91qFmSiFKiluk655WzPF+DDMA02qIyy8uiRqI8QXtcFpEvll12LpL5MXqEmAZ+dcA==} + no-case@3.0.4: + resolution: {integrity: sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==} + node-addon-api@7.1.1: resolution: {integrity: sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ==} @@ -1253,6 +1334,9 @@ packages: parse5@7.2.1: resolution: {integrity: sha512-BuBYQYlv1ckiPdQi/ohiivi9Sagc9JG+Ozs0r7b/0iK3sKmrb0b9FdWdBbOdx6hBCM/F9Ir82ofnBhtZOjCRPQ==} + pascal-case@3.1.2: + resolution: {integrity: sha512-uWlGT3YSnK9x3BQJaOdcZwrnV6hPpd8jFH1/ucpiLRPh/2zCVJKS19E4GvYHvaCcACn3foXZ0cLB9Wrx1KGe5g==} + path-exists@4.0.0: resolution: {integrity: sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==} engines: {node: '>=8'} @@ -1437,6 +1521,16 @@ packages: resolution: {integrity: sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==} engines: {node: '>=4'} + svelte2tsx@0.7.34: + resolution: {integrity: sha512-WTMhpNhFf8/h3SMtR5dkdSy2qfveomkhYei/QW9gSPccb0/b82tjHvLop6vT303ZkGswU/da1s6XvrLgthQPCw==} + peerDependencies: + svelte: ^3.55 || ^4.0.0-next.0 || ^4.0 || ^5.0.0-next.0 + typescript: ^4.9.4 || ^5.0.0 + + svelte@5.19.7: + resolution: {integrity: sha512-I0UUp2MpB5gF8aqHJVklOcRcoLgQNnBolSwLMMqDepE9gVwmGeYBmJp1/obzae72QpxdPIymA4AunIm2x70LBg==} + engines: {node: '>=18'} + tinyexec@0.3.2: resolution: {integrity: sha512-KQQR9yN7R5+OSwaK0XQoj22pwHoTlgYqmUscPYoknOoWCWfj/5/ABTMRi69FrKU5ffPVh5QcFikpWJI/P1ocHA==} @@ -1467,8 +1561,8 @@ packages: resolution: {integrity: sha512-ojFL7eDMX2NF0xMbDwPZJ8sb7ckqtlAi1GsmgsFXvErT9kFTk1r0DuQKvrCh73M6D4nngeHJmvogF9OluXs7Hw==} engines: {node: '>=16'} - typescript@5.7.2: - resolution: {integrity: sha512-i5t66RHxDvVN40HfDd1PsEThGNnlMCMT3jMUuoh9/0TaqWevNontacunWyN02LA9/fIbEWlcHZcgTKb9QoaLfg==} + typescript@5.7.3: + resolution: {integrity: sha512-84MVSjMEHP+FQRPy3pX9sTVV/INIex71s9TL2Gm5FG/WG1SqXeKyZ0k7/blY/4FdOzI12CBy1vGc4og/eus0fw==} engines: {node: '>=14.17'} hasBin: true @@ -1668,6 +1762,9 @@ packages: resolution: {integrity: sha512-GQHQqAopRhwU8Kt1DDM8NjibDXHC8eoh1erhGAJPEyveY9qqVeXvVikNKrDz69sHowPMorbPUrH/mx8c50eiBQ==} engines: {node: '>=18'} + zimmerframe@1.1.2: + resolution: {integrity: sha512-rAbqEGa8ovJy4pyBxZM70hg4pE6gDgaQ0Sl9M3enG3I0d6H4XSAM3GeNGLKnsBpuijUow064sf7ww1nutC5/3w==} + zod-to-json-schema@3.24.1: resolution: {integrity: sha512-3h08nf3Vw3Wl3PK+q3ow/lIil81IT2Oa7YpQyUUDsEWbXveMesdfK1xBd2RhCkynwZndAxixji/7SYJJowr62w==} peerDependencies: @@ -1687,6 +1784,11 @@ packages: snapshots: + '@ampproject/remapping@2.3.0': + dependencies: + '@jridgewell/gen-mapping': 0.3.8 + '@jridgewell/trace-mapping': 0.3.25 + '@ark/schema@0.39.0': dependencies: '@ark/util': 0.39.0 @@ -1726,6 +1828,28 @@ snapshots: dependencies: prismjs: 1.29.0 + '@astrojs/svelte@7.0.4(astro@5.2.3(rollup@4.28.1)(sass@1.83.0)(typescript@5.7.3))(sass@1.83.0)(svelte@5.19.7)(typescript@5.7.3)': + dependencies: + '@sveltejs/vite-plugin-svelte': 5.0.3(svelte@5.19.7)(vite@6.0.11(sass@1.83.0)) + astro: 5.2.3(rollup@4.28.1)(sass@1.83.0)(typescript@5.7.3) + svelte: 5.19.7 + svelte2tsx: 0.7.34(svelte@5.19.7)(typescript@5.7.3) + typescript: 5.7.3 + vite: 6.0.11(sass@1.83.0) + transitivePeerDependencies: + - '@types/node' + - jiti + - less + - lightningcss + - sass + - sass-embedded + - stylus + - sugarss + - supports-color + - terser + - tsx + - yaml + '@astrojs/telemetry@3.2.0': dependencies: ci-info: 4.1.0 @@ -1941,8 +2065,23 @@ snapshots: '@img/sharp-win32-x64@0.33.5': optional: true + '@jridgewell/gen-mapping@0.3.8': + dependencies: + '@jridgewell/set-array': 1.2.1 + '@jridgewell/sourcemap-codec': 1.5.0 + '@jridgewell/trace-mapping': 0.3.25 + + '@jridgewell/resolve-uri@3.1.2': {} + + '@jridgewell/set-array@1.2.1': {} + '@jridgewell/sourcemap-codec@1.5.0': {} + '@jridgewell/trace-mapping@0.3.25': + dependencies: + '@jridgewell/resolve-uri': 3.1.2 + '@jridgewell/sourcemap-codec': 1.5.0 + '@nodelib/fs.scandir@2.1.5': dependencies: '@nodelib/fs.stat': 2.0.5 @@ -2118,6 +2257,28 @@ snapshots: '@shikijs/vscode-textmate@10.0.1': {} + '@sveltejs/vite-plugin-svelte-inspector@4.0.1(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.19.7)(vite@6.0.11(sass@1.83.0)))(svelte@5.19.7)(vite@6.0.11(sass@1.83.0))': + dependencies: + '@sveltejs/vite-plugin-svelte': 5.0.3(svelte@5.19.7)(vite@6.0.11(sass@1.83.0)) + debug: 4.4.0 + svelte: 5.19.7 + vite: 6.0.11(sass@1.83.0) + transitivePeerDependencies: + - supports-color + + '@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.19.7)(vite@6.0.11(sass@1.83.0))': + dependencies: + '@sveltejs/vite-plugin-svelte-inspector': 4.0.1(@sveltejs/vite-plugin-svelte@5.0.3(svelte@5.19.7)(vite@6.0.11(sass@1.83.0)))(svelte@5.19.7)(vite@6.0.11(sass@1.83.0)) + debug: 4.4.0 + deepmerge: 4.3.1 + kleur: 4.1.5 + magic-string: 0.30.17 + svelte: 5.19.7 + vite: 6.0.11(sass@1.83.0) + vitefu: 1.0.5(vite@6.0.11(sass@1.83.0)) + transitivePeerDependencies: + - supports-color + '@types/cookie@0.6.0': {} '@types/debug@4.1.12': @@ -2146,6 +2307,10 @@ snapshots: '@ungap/structured-clone@1.2.1': {} + acorn-typescript@1.4.13(acorn@8.14.0): + dependencies: + acorn: 8.14.0 + acorn@8.14.0: {} ansi-align@3.0.1: @@ -2178,7 +2343,7 @@ snapshots: array-iterate@2.0.1: {} - astro@5.2.3(rollup@4.28.1)(sass@1.83.0)(typescript@5.7.2): + astro@5.2.3(rollup@4.28.1)(sass@1.83.0)(typescript@5.7.3): dependencies: '@astrojs/compiler': 2.10.3 '@astrojs/internal-helpers': 0.5.0 @@ -2225,7 +2390,7 @@ snapshots: semver: 7.7.0 shiki: 1.29.2 tinyexec: 0.3.2 - tsconfck: 3.1.4(typescript@5.7.2) + tsconfck: 3.1.4(typescript@5.7.3) ultrahtml: 1.5.3 unist-util-visit: 5.0.0 unstorage: 1.14.4 @@ -2238,7 +2403,7 @@ snapshots: yocto-spinner: 0.2.0 zod: 3.24.1 zod-to-json-schema: 3.24.1(zod@3.24.1) - zod-to-ts: 1.2.0(typescript@5.7.2)(zod@3.24.1) + zod-to-ts: 1.2.0(typescript@5.7.3)(zod@3.24.1) optionalDependencies: sharp: 0.33.5 transitivePeerDependencies: @@ -2377,6 +2542,10 @@ snapshots: dependencies: character-entities: 2.0.2 + dedent-js@1.0.1: {} + + deepmerge@4.3.1: {} + defu@6.1.4: {} dequal@2.0.3: {} @@ -2445,8 +2614,14 @@ snapshots: escape-string-regexp@5.0.0: {} + esm-env@1.2.2: {} + esprima@4.0.1: {} + esrap@1.4.3: + dependencies: + '@jridgewell/sourcemap-codec': 1.5.0 + estree-walker@2.0.2: {} estree-walker@3.0.3: @@ -2638,6 +2813,10 @@ snapshots: is-plain-obj@4.1.0: {} + is-reference@3.0.3: + dependencies: + '@types/estree': 1.0.6 + is-wsl@3.1.0: dependencies: is-inside-container: 1.0.0 @@ -2662,12 +2841,18 @@ snapshots: pify: 4.0.1 strip-bom: 3.0.0 + locate-character@3.0.0: {} + locate-path@5.0.0: dependencies: p-locate: 4.1.0 longest-streak@3.1.0: {} + lower-case@2.0.2: + dependencies: + tslib: 2.8.1 + lru-cache@10.4.3: {} magic-string@0.30.17: @@ -3014,6 +3199,11 @@ snapshots: dependencies: '@types/nlcst': 2.0.3 + no-case@3.0.4: + dependencies: + lower-case: 2.0.2 + tslib: 2.8.1 + node-addon-api@7.1.1: optional: true @@ -3069,6 +3259,11 @@ snapshots: dependencies: entities: 4.5.0 + pascal-case@3.1.2: + dependencies: + no-case: 3.0.4 + tslib: 2.8.1 + path-exists@4.0.0: {} pathe@1.1.2: {} @@ -3343,6 +3538,30 @@ snapshots: strip-bom@3.0.0: {} + svelte2tsx@0.7.34(svelte@5.19.7)(typescript@5.7.3): + dependencies: + dedent-js: 1.0.1 + pascal-case: 3.1.2 + svelte: 5.19.7 + typescript: 5.7.3 + + svelte@5.19.7: + dependencies: + '@ampproject/remapping': 2.3.0 + '@jridgewell/sourcemap-codec': 1.5.0 + '@types/estree': 1.0.6 + acorn: 8.14.0 + acorn-typescript: 1.4.13(acorn@8.14.0) + aria-query: 5.3.2 + axobject-query: 4.1.0 + clsx: 2.1.1 + esm-env: 1.2.2 + esrap: 1.4.3 + is-reference: 3.0.3 + locate-character: 3.0.0 + magic-string: 0.30.17 + zimmerframe: 1.1.2 + tinyexec@0.3.2: {} to-regex-range@5.0.1: @@ -3353,16 +3572,15 @@ snapshots: trough@2.2.0: {} - tsconfck@3.1.4(typescript@5.7.2): + tsconfck@3.1.4(typescript@5.7.3): optionalDependencies: - typescript: 5.7.2 + typescript: 5.7.3 - tslib@2.8.1: - optional: true + tslib@2.8.1: {} type-fest@4.30.1: {} - typescript@5.7.2: {} + typescript@5.7.3: {} ufo@1.5.4: {} @@ -3499,13 +3717,15 @@ snapshots: yoctocolors@2.1.1: {} + zimmerframe@1.1.2: {} + zod-to-json-schema@3.24.1(zod@3.24.1): dependencies: zod: 3.24.1 - zod-to-ts@1.2.0(typescript@5.7.2)(zod@3.24.1): + zod-to-ts@1.2.0(typescript@5.7.3)(zod@3.24.1): dependencies: - typescript: 5.7.2 + typescript: 5.7.3 zod: 3.24.1 zod@3.24.1: {} diff --git a/src/layouts/SlideLayout.astro b/src/layouts/SlideLayout.astro index da7ce8d..2720f98 100644 --- a/src/layouts/SlideLayout.astro +++ b/src/layouts/SlideLayout.astro @@ -1,10 +1,12 @@ --- export interface Props { - title: string; - authors: string[]; - description?: string; + title: string; + authors: string[]; + description?: string; } import Layout from "./BaseLayout.astro"; +import "reveal.js/dist/reveal.css"; +import "reveal.js/plugin/highlight/monokai.css"; import "@theme"; const { title, authors, description } = Astro.props; @@ -14,20 +16,6 @@ const { title, authors, description } = Astro.props; {description && } {authors.map((author) => )} - -
@@ -38,7 +26,7 @@ const { title, authors, description } = Astro.props;
- + +
+

{title}

+
+ {#if values.length > 1} + {#each values as value} + + {/each} + {/if} +
+
+ {#each [1, 2, 3] as index} +
{index}
+ {/each} +
+ 
+      
+        .container {"{"}
+          {property}: {selected};
+        {"}"}
+      
+
+
+ + diff --git a/src/slides/flexbox/index.astro b/src/slides/flexbox/index.astro index 3c25860..b4de927 100644 --- a/src/slides/flexbox/index.astro +++ b/src/slides/flexbox/index.astro @@ -1,4 +1,6 @@ --- +import CSSPropertyDemo from "./components/CSSPropertyDemo.svelte"; + export const title = "CSS Flexbox"; export const authors = ["Henrique Ramos"]; export const publishedAt = "2025-01-27"; @@ -16,78 +18,35 @@ export const draft = true;
-

Basic Flexbox Container

-
-
1
-
2
-
3
-
- 

-.container {'{'}
-  display: flex;
-{'}'}
-
+
-

justify-content

-
-
1
-
2
-
3
-
- 

-.container {'{'}
-  justify-content: space-between;
-{'}'}
-
+
-

align-items

-
-
1
-
2
-
3
-
- 

-.container {'{'}
-  align-items: center;
-{'}'}
-
+
-

flex-direction

-
-
1
-
2
-
3
-
- 

-.container {'{'}
-  flex-direction: column;
-{'}'}
-
+
- - diff --git a/src/theme/variables.css b/src/theme/variables.css index 1324947..f3808b9 100644 --- a/src/theme/variables.css +++ b/src/theme/variables.css @@ -1,6 +1,7 @@ :root { --background: #000; --background-color: #000; + --base-spacing: 8px; --main-font: "Anaheim", sans-serif; --main-font-size: 40px; @@ -26,8 +27,8 @@ --code-font: monospace; --link-color: #aaaaff; - --link-color-dark: color.scale(#aaaaff, $lightness: -15%); - --link-color-hover: color.scale(#aaaaff, $lightness: 20%); + --link-color-dark: color-mix(in srgb, var(--link-color), #000 10%); + --link-color-hover: color-mix(in srgb, var(--link-color), #000 20%); --selection-background-color: #888; --selection-color: #fff; diff --git a/src/utils/getAstroPages.ts b/src/utils/getAstroPages.ts index 74c8783..0467c80 100644 --- a/src/utils/getAstroPages.ts +++ b/src/utils/getAstroPages.ts @@ -21,23 +21,19 @@ const getAstroPages = & AstroInstance>({ files, schema, }: Opts) => - Object.values(files) - .filter(({ draft }) => !draft) - .map((module) => { - const validate = schema.and(astroPageType)(module); - if (validate instanceof type.errors) - return console.error( - `Invalid module${module.file}: ${validate.summary}`, - ); + Object.values(files).map((module) => { + const validate = schema.and(astroPageType)(module); + if (validate instanceof type.errors) + throw new Error(`Invalid module${module.file}: ${validate.summary}`); - return { - id: ( - module.file - .split("/") - .at(module.file.includes("index.astro") ? -2 : -1) ?? "" - ).replace(".astro", ""), - ...module, - }; - }); + return { + id: ( + module.file + .split("/") + .at(module.file.includes("index.astro") ? -2 : -1) ?? "" + ).replace(".astro", ""), + ...module, + }; + }); export default getAstroPages; diff --git a/src/utils/getSlides.ts b/src/utils/getSlides.ts index 2dab6ee..cbb924a 100644 --- a/src/utils/getSlides.ts +++ b/src/utils/getSlides.ts @@ -8,6 +8,7 @@ type Slide = AstroInstance & { description: string; authors: string[]; publishedAt: string; + draft?: boolean; }; /** diff --git a/svelte.config.js b/svelte.config.js new file mode 100644 index 0000000..522c1ef --- /dev/null +++ b/svelte.config.js @@ -0,0 +1,5 @@ +import { vitePreprocess } from '@astrojs/svelte'; + +export default { + preprocess: vitePreprocess(), +}