Board artwork: one component draws the game, the hall's still, and the share card, with gradients on the pieces, plank joins and inlaid corners on the oak, and the stone as it was

npm run art renders the standalone SVGs and the 1200 by 630 card through
Sharp, a development dependency only.
This commit is contained in:
Eric Wagoner
2026-09-23 19:32:15 -04:00
parent 145667ea0d
commit a213a238d3
12 changed files with 1089 additions and 382 deletions
+19
View File
@@ -0,0 +1,19 @@
# Board artwork
`src/lib/components/BoardArtwork.svelte` owns both palettes, surface filters,
wear, grid, inlays and counters. `Board.svelte` supplies interactive state;
`Hall.svelte` supplies an opening position from the game engine. Update the
shared component to change either illustration and the game together.
After editing the artwork, run:
```sh
npm run art
```
This renders the same Svelte component into `static/board-copenhagen.svg` and
`static/board-tablut.svg`, then regenerates `docs/og-card.svg` and the 1200 × 630
`static/og.png`. Preview the share composition in `docs/og-card.html`.
The share composition and copy live in `docs/render-art.mjs`. Commit generated
assets with source changes. The export uses Sharp as a development dependency;
it does not add any image-processing code to the shipped app.