Rebuild the playground as the better-content intro site - #1
Merged
Merged
Conversation
Drop the "playground" framing. The page now introduces better-content and happens to be editable, rather than presenting itself as a demo annexe. Palette is derived from logo.svg instead of the inherited warm paper: white ground, #20242b ink, #71767f muted, and #ffe24a as the marker. Yellow is only ever a background with dark text on it, never a text colour. Header is a three column grid so the nav sits on the true centre regardless of what the actions weigh. Actions swap between reading and editing off html.editing-on, with the keyboard shortcuts wired. Edit affordances are scoped to hover and focus. Entering edit mode no longer tints, outlines or reflows anything. Structure: - Toolbar.astro becomes SiteHeader.astro, Base.astro gains the real footer - PreviewFrame splits into HeroIsland, RowsIsland and NoteIsland - Vue and Svelte render NoteCard directly, so all three bindings show the same row - index.astro becomes hero plus five numbered sections - the adapter switch moves onto the database panel, where its effect shows Performance: PGlite was constructed at module scope in db.ts, so 16 MB of Postgres wasm downloaded on every visit including the adapters that never touch it. Schema, DDL and client move to lib/pgliteAdapter.ts behind a dynamic import in loadAdapter(). Initial JS is now 68 KB gzipped. Loading states carry no copy. The hero and database rows render shimmering skeletons instead of hardcoded seed text, which was flashing stale content for anyone whose rows had been edited. The page table gains a tagline column, with ALTER TABLE in the DDL.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
This branch was successfully deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Drop the "playground" framing. The page now introduces better-content and happens to be editable, rather than presenting itself as a demo annexe.
Palette is derived from logo.svg instead of the inherited warm paper: white ground, #20242b ink, #71767f muted, and #ffe24a as the marker. Yellow is only ever a background with dark text on it, never a text colour.
Header is a three column grid so the nav sits on the true centre regardless of what the actions weigh. Actions swap between reading and editing off html.editing-on, with the keyboard shortcuts wired.
Edit affordances are scoped to hover and focus. Entering edit mode no longer tints, outlines or reflows anything.
Structure:
Performance: PGlite was constructed at module scope in db.ts, so 16 MB of Postgres wasm downloaded on every visit including the adapters that never touch it. Schema, DDL and client move to lib/pgliteAdapter.ts behind a dynamic import in loadAdapter(). Initial JS is now 68 KB gzipped.
Loading states carry no copy. The hero and database rows render shimmering skeletons instead of hardcoded seed text, which was flashing stale content for anyone whose rows had been edited.
The page table gains a tagline column, with ALTER TABLE in the DDL.