ship v0 wireframe parity (chrome + glass + terminal + logos)#3
Open
federicodeponte wants to merge 3 commits intov1-hotload-previewfrom
Open
ship v0 wireframe parity (chrome + glass + terminal + logos)#3federicodeponte wants to merge 3 commits intov1-hotload-previewfrom
federicodeponte wants to merge 3 commits intov1-hotload-previewfrom
Conversation
- Forest-deep glass terminal (rgba(15,31,23,0.94) + 20px blur), no more pure black - Real agent logos (Anthropic, OpenAI, Gemini, Kimi, OpenCode) inline SVG - Skill page: ONE outer glass card + click-to-expand sections (Install / Trust / Skill content) - Hero glass: 60px blur + multi-layer shadow + emerald refraction (visionOS-deep) - Apple-emerald-v3 design tokens (cream, ink, emerald 0a5230, Onest + Instrument Serif) - OSS attribution: MIT pill in header + Apache/MIT line in footer - Shared V0Chrome component (Background + Nav + Footer) used across all 12 routes - Mobile parity: 720px breakpoints, 44px+ touch targets, accordions still work Preserves v1-hotload-preview features (live demo card, why-bother grid, FAQ accordion). No Tailwind added. No env vars touched. No data-layer changes. Routes touched: / (landing), /sign-in, /docs/publish, /docs/cli, /auth/cli, /privacy, /terms, /s/[slug], /s/[slug]/not-found, /not-found Plus all /docs/* via DocsChrome shim. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
- Skill page hero card was set to opacity:0 via .v0-reveal but no IntersectionObserver was registered to add the .in class, leaving the entire skill card invisible on first load. Removed v0-reveal from the server-rendered card. - Add Three Kinds (Knowledge / Instructions / Workflows) section to the landing between SEE WHAT THEY SEE and HOW IT FEELS to match the locked wireframe section ordering and POSITIONING.md skill definition. Three glass cards with emerald labels and tag chips. - REAL USERS testimonials section intentionally not ported (would require fabricated attestations). - Hero orbit chips intentionally not ported (existing chip row already covers the "no GitHub / no copy-paste / no Slack" beat).
3 tasks
Bring the authenticated routes up to v0 wireframe parity: - /library: tabs (Saved | Published), search, glass cards with mascot, empty states with mascot + CTA. Saved view degrades gracefully when the saved-skills route is intentionally not-live in v0 (renders a "coming next" panel instead of a hard error). - /settings: redirects to /settings/api-keys. - /settings/api-keys: glass key list with revoke, create form, key reveal in a forest-deep terminal block, CLI hint. Renders a "coming next" panel when the api-keys API returns 404 in v0. - /settings/account: profile panel (avatar with re-roll + seed input, display name, read-only email) and a danger-styled delete-account panel. Profile fields persist to localStorage until the profile schema lands; delete opens a mailto for ops to handle. - AppShell: redrawn nav with floom wordmark + MIT pill, primary links for Library / Publish / CLI / Settings, email + sign out on the right. - app-shell.css: rebuilt against v0 tokens (cream + emerald aurora, glass cards, Instrument Serif headlines, ink/cream pill buttons, forest-deep terminal block) so authenticated surfaces match the wireframes and the rest of the v0 chrome. All four routes auth-gate to /sign-in?next=... instead of 404 when signed out.
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
Brings the React app at
web/into visual parity with the locked v0 Apple-emerald-v3 wireframes. No Tailwind added. No data-layer changes. v1-hotload-preview features preserved.rgba(15,31,23,0.94)+ 20px backdrop-blur + translucent border +#FCD34Dprompt +#5DDBA1success). Replaces previous pure-black#1a1a1aterminals everywhere.src/components/AgentLogos.tsx). Used in landing trust band + skill page compat row.<details>sections (Install command / Trust details / Skill content). Uses native<details>for Apple-y chevron rotation.::beforehighlight +::afteremerald refraction. Matches the visionOS-deep aesthetic of the wireframe.V0Chrome.tsx):<V0Background />+<V0Nav />+<V0Footer />used across all 12 routes. DocsChrome legacy shim now delegates to V0Chrome so all/docs/*pages pick up the new chrome automatically.globals.cssunder--v0-*. Body font switched to Onest (matches latest wireframes) with Instrument Serif for display.What was preserved (v1-hotload-preview)
landing-demo-frame) — restyled, not removed.lib/supabase,lib/markdown,lib/env,lib/slug,parseSkill,renderMarkdown,getUserFromServerCookies, OG route — UNTOUCHED.Out of scope (intentionally not changed)
package.jsondeps — none added.cli/— out of scope (web parity sweep only)./docs/getting-started,/docs/api,/docs/mcp,/library,/connect/*,/settings/*,/developers,/login) — left alone, they automatically pick up v0 chrome where they use<DocsNav />.Test plan
pnpm typecheck— zero errorspnpm build— zero new errors/warnings, all 12 routes built/this-page-does-not-exist, returns 404 by design)v0-bg-mesh,v0-glass-hero, etc.) present in all rendered HTML<em>floom.</em>, dark CTA)Branch base
Branched off
v1-hotload-preview(notmain) so v1 features ship together with the visual parity.