Repository navigation
Commit 15e0ef0
authored
feat(init): refresh design of Pages starter templates (#584)
## Summary
Replace the plain `void init` welcome pages with a shared Vite-style
layout for React, Vue, Svelte, and Solid, using Void colors, system
fonts, and automatic light/dark mode.
Preserve the original Pages-mode guidance and the database starters'
message list, form, API example, and seed instructions. Bundle a small
stack SVG and a theme-aware Void logo with `void`, with Vite attribution
embedded in the icon sprite.
Keep the shared starter styles in a CSS source file and inline the raw
CSS into the CLI bundle, with matching type declarations and build/test
configuration.
> [!IMPORTANT]
> This ships the SVG files with the core `void` package. I'm not a fan
of this but the starter code is already implemented within `void` and
since the SVG files are just a few KB + won't be bundled into a build,
it's not terrible.
>
> My preference would be to shift the starter code and assets into
`create-void`, but then `void init` will have to call `create-vite`,
creating a circular dep. Happy to do this in a follow-up PR.
>
> Also, I'm not sure why `void init` needs to exist when there's
`create-void`. Maybe it can be removed?
## Examples
Screenshots from the four generated apps. React and Vue include
database-backed message forms; Svelte and Solid use Static Pages.
| React | Vue |
| --- | --- |
| 
| 
|
| Svelte | Solid |
| --- | --- |
| 
| 
|
## Validation:
- `CI=true vp run test`: 734 test files and 14,499 tests passed; 31
tests skipped.
- `vp run check`: all 33 typecheck tasks passed.
- Targeted lint and formatting checks passed.
- Rebuilt CLI smoke test confirms generated `pages/style.css` matches
`starter-ui.css` byte-for-byte.
- Browser-verified the stack illustration and Void logo in light and
dark mode.1 parent 0b662af commit 15e0ef0
14 files changed
Lines changed: 787 additions & 203 deletions
File tree
- packages/void
- src
- cli
- templates/assets
- test/unit
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
| |||
20 | 20 | | |
21 | 21 | | |
22 | 22 | | |
| 23 | + | |
23 | 24 | | |
24 | 25 | | |
25 | 26 | | |
| |||
0 commit comments