feat(webapp): restyle to tokens.xyz design system#78
Merged
Conversation
Light-only cream/sand background, Inter Variable self-hosted, fixed top-only header with scroll-aware backdrop blur. Dropped sidebar app shell, dropped next-themes ThemeProvider. Migrated --foreground / --muted-foreground / --border / --ring root tokens to sand scale. Adopted DS semantic typography via @solana/design-system styles + base.css imports. Buttons rounded-full with active scale + motion-reduce. Panel cards neutralized to white/cream with .border-all-dashed-medium accent. Hero-entrance keyframe applied to marketplace plan grid. Inline code pill styling: berkeley-mono, sand-200 bg, sand-300 border. Bulk neutralized decorative emerald/purple/blue/teal across 25+ files (text, backgrounds, borders, gradients) to foreground/sand. Kept only semantic state colors: destructive red, warning amber (sunset/stale/ expired/excluded). Subscribe + Initialize primary actions switched to filled foreground buttons. WalletButton sized to match ClusterButton. Deleted dead app-footer, app-sidebar, theme-provider files. Stripped dead --sidebar-* CSS variables.
dev-jodee
force-pushed
the
feat/restyle-webapp-tokens-xyz
branch
from
fb2ba50 to
25bea49
Compare
Compute Unit Report
Generated: 2026-04-30 |
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.
Summary
styles+base.cssimports for semantic typography.border-all-dashed-mediumfrom tokens packages/ui (SOL/USDC/summary/plan/panel cards); subscribe + initialize primary actions switched to filled foreground buttons; WalletButton matched to ClusterButton heightVisual reference
Tokens.xyz cloned from
solana-foundation/tokens. Source-of-truth files used:packages/ui/src/globals.css— sand color scale, dashed borders, theme tokensapps/web/src/app/layout.tsx— Inter preload, light-only Toaster configapps/web/src/components/header.tsx— scroll-aware backdrop patternTest plan
just fmtcleanjust checkclean (lint + IDL/client gen + TS client build)pnpm --filter webapp buildsucceeds/,/marketplace,/delegations,/subscriptions,/plans,/plans/collect,/faucet)Preview
https://solana-subscriptions-program-potfuaz32-solana-foundation.vercel.app
Notes
app-footer.tsx,app-sidebar.tsx,theme-provider.tsx--sidebar-*CSS variables from:rootand@theme inlinenext-themespackage retained in dependencies (cleanup deferred — not imported)webapp/api/andwebapp/scripts/(@solana/kitmember changes) unrelated to this PR