Website refactor: Statusbrew-inspired aesthetic across marketing, docs, cockpit (Phases 1-8)#270
Merged
Merged
Conversation
Design spec for refactoring apps/website to a modern, no-nonsense SaaS aesthetic inspired by Statusbrew while preserving the existing brand. Covers tokens, shared component primitives, homepage IA (12 sections), migration plan for /pilot-to-prod, /angular, /chat, /render, /solutions, /pricing, and 6-phase implementation phasing. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Implementation plan for Phase 1 of the Statusbrew-inspired website refactor. Additive-only changes to @ngaf/design-tokens (new surfaces, shadows, radius, space namespaces + colors/typography extensions), plus nine new UI primitives in apps/website/src/components/ui/, a cn() helper, Tailwind @theme additions, and a /_dev/primitives showcase route with Playwright coverage. 23 tasks, no production-page changes. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…v0.0.30) Additive-only changes for the website Statusbrew-aesthetic refactor (Phase 1): - new namespaces: surfaces, shadows, radius, space - colors: add accentHover, textInverted - typography: add h1/h2/h3/eyebrow/bodyLg/body/caption type scale - tokens.css: mirror everything as --ds-* custom properties - tokens aggregator + index.ts updated - tokens.spec.ts: vitest assertions for all additions No existing tokens modified. Version bumped 0.0.29 → 0.0.30 per repo patch-only policy. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- apps/website/lib/design-tokens.ts: re-export from @ngaf/design-tokens so the website has one source of truth (was a stale partial duplicate) - src/app/global.css: extend Tailwind @theme with new surface/border colors, radii, and shadow variables (additive — no existing variables removed) - src/lib/cn.ts: clsx + tailwind-merge composition helper for the upcoming UI primitives No visible site changes — primitives that consume these tokens land in the next bundle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
- Container — max-width wrapper with responsive padding - Section — vertical rhythm + surface variants (canvas/tinted/white) - Eyebrow — mono uppercase label with brand-tone variants - Pill — small rounded tag with neutral/accent/angular variants - Button — primary/secondary/ghost × md/lg; renders <a> when href set - Card — white surface with hoverable lift via CSS - BrowserFrame — Mac-style chrome for screenshots and live demos - LogoMark — 🛩️ + wordmark - FAQ — native <details> accordion, kbd-accessible by default All server components except FAQ (which works without 'use client' because <details> is a native element). Styled via inline style props against @ngaf/design-tokens, matching the existing codebase pattern. global.css gets Card hover styles + FAQ chevron rotation + summary focus ring. No production page uses these yet — wiring lands in Bundle 6's /_dev/primitives showcase. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
A dev-only route that renders one of each UI primitive (LogoMark, Eyebrow, Pill, Button, Card, BrowserFrame, Section, FAQ) so the new design-system primitives are both eyeball-verifiable and asserted in CI. The route will be deleted in a later phase once the marketing pages have migrated. Note: route is /dev/primitives (not _dev/primitives) because Next.js App Router treats leading-underscore folders as private and unrouted. Playwright spec covers all 9 primitives plus FAQ open/close + keyboard focus. Verification (this commit): all 23 website e2e tests pass — 10 new primitives tests + 13 existing tests unchanged. Phase 1 complete with zero regressions to visible pages. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Reviewer flagged: Card.tsx applied a 'card-primitive' className but no CSS selector references it (hover styles target the data-ui attribute instead). Trivial dead code cleanup. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Plan to refactor the three site-wide shared components to use the Phase 1 primitives and tokens. Drops glassmorphism site-wide, removes framer-motion from the shell layer, swaps in LogoMark/Button/Eyebrow primitives. Preserves all analytics tracking and the deep mobile-docs nav. 4 tasks, ~3 commits. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…mitives Site-wide chrome refactor to the Statusbrew-shaped aesthetic: Nav.tsx: - White surface with hairline bottom border + shadow-sm (was glass blur) - LogoMark for the brand mark (was inline serif text) - Get Started CTA uses Button primitive (desktop + mobile) - Mobile overlay solid white with shadow-lg (was glass blur) - All analytics tracking + deep mobile-docs nav preserved Footer.tsx: - White surface with hairline top border (was glass blur) - LogoMark for the brand mark - Eyebrow primitive for column headings (Product/Libraries/Solutions/Resources) - Newsletter Subscribe button uses Button primitive - framer-motion removed (in-view fade dropped — footer is below the fold) - Input uses surface tokens (was glass.border) AnnouncementToast.tsx: - White surface with shadow-lg (was glass blur + custom shadow) - framer-motion + AnimatePresence removed; replaced with rAF-driven mounted-state CSS transition (opacity + translateY) - Get the Guide + Send me the guide buttons use Button primitive - Input uses surface tokens - All analytics tracking preserved e2e/primitives.spec.ts: - LogoMark + Eyebrow assertions scoped to `main` since the shell now renders these primitives site-wide Verification: all 23 e2e tests pass. No regressions to visible pages beyond the intended shell restyle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
12 tasks covering 10 new landing components, LiveCockpitFrame (IntersectionObserver lazy iframe for the signature demo), and page.tsx rewrite to the new 11-section IA. Phase 3 (screenshot capture) deferred — uses placeholder content in BrowserFrames. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Drops the gradient blob ambient background and 7-section narrative
spine. Replaces with a developer-first, product-led homepage built on
Phase 1 primitives.
New landing components in apps/website/src/components/landing/:
- Hero.tsx — eyebrow + h1 + subhead + CTA pair + Pill trust row +
layered 2-frame BrowserFrame collage
- ProofStrip.tsx — 5 honest signals as Cards (no borrowed customer
logos)
- Differentiator.tsx — editorial POV ("Built for Angular, not
retrofitted") + 4-card sub-grid carrying forward the current
Runtime/Streaming/GenUI/License copy from PositioningStrip
- FeatureBlock.tsx — reusable two-column section primitive consumed
by Stream/Render/Ship; supports visualLeft alternation
- LiveCockpitFrame.tsx — IntersectionObserver lazy iframe for the
signature live demo on the Ship block
- PilotBlock.tsx — tinted section, 8-week Discover/Build/Harden/Train
timeline as Cards, dual CTA
- WhitePaperBlock.tsx — email-gated download with tilted PDF cover in
BrowserFrame; always-visible direct-download fallback for
returning visitors
- Promises.tsx — 5-card "what we won't do" grid
- HomeFAQ.tsx — 8-question accordion using the FAQ primitive (drafts
for user revision)
- FinalCTA.tsx — italic-headline closing band
page.tsx: 11 sections, no gradient blobs, no ambient washes. Stream/
Render/Ship feature blocks alternate visualLeft; Ship hosts the live
cockpit iframe.
e2e: hero / differentiator / feature-block assertions replace the
obsolete architecture / libraries selectors. WhitePaperBlock keeps a
direct /whitepaper.pdf link visible so the existing whitepaper-link
test passes.
All 23 e2e tests pass. Phase 3 (screenshot capture) deferred —
BrowserFrames currently show placeholder content + ascii prose.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
PricingGrid: 2 Cards using Eyebrow/Button primitives; highlighted tier uses surface=dim + 2px accent border instead of glow. LeadForm: Card-wrapped form, inputs use surface tokens, focus rings use shadow-focus token; submit becomes Button primitive. page.tsx: clean Hero-style header, drops blob background, adds FinalCTA at the end for cross-page rhythm. Tests: pricing-related e2e (plan cards + lead-form validation + nav-pricing-link) all pass. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Rewrites the page to the new dev-tool-SaaS aesthetic: centered Hero with Pill trust row, 3 FeatureBlocks (Discover/Build/Harden) keyed to the 8-week timeline, a tinted outcomes-grid section, the shared WhitePaperBlock, Promises (the 5 ‘what we won't do' commitments), a contact anchor, and FinalCTA. The old PilotHero/WhatIsIncluded/ HowItWorks/ProblemSection/PricingSignal/RiskRemoval/WhitePaperGate/ PilotFooterCTA sections are no longer imported — they become orphans for Phase 6 cleanup. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Each library landing page now shares the same shape: - Centered Hero with library-specific Pill trust row - 2 FeatureBlocks — one for the library's defining capability, one for its escape-hatch / power-user surface - WhitePaperBlock — shared with homepage + pilot-to-prod - FinalCTA The existing AngularCodeShowcase / ChatLandingCodeShowcase / RenderCodeShowcase components are reused as the visual for one FeatureBlock per page (they already use shiki/HighlightedCode and are valuable). Everything else from the old library-page chrome (AngularHero, AngularProblemSolution, AngularFeaturesGrid, etc.) becomes orphaned and gets deleted in Phase 6. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
/solutions index: clean Hero + 3 Card grid driven by SOLUTIONS data
(displays eyebrow, title, subtitle, top 2 proof Pills, hover lift,
clickable to the slug page). Drops the framer-motion-heavy old
SolutionsGrid. Adds WhitePaperBlock + FinalCTA at the bottom.
Note: /solutions/[slug] pages still use the old per-solution
components (SolutionHero, SolutionProblem, etc.) — those are
data-rich and need their own focused pass. Deferred.
WhitePaperBlock now takes an optional `paper` prop with library
variants ('overview' | 'angular' | 'render' | 'chat'). PDF paths
and analytics tags routed accordingly. /angular, /chat, /render
each pass their library variant so the existing
whitepapers-link-from-marketing-pages e2e test (which asserts each
library page links to /whitepapers/{lib}.pdf) keeps passing.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Deletes 31 landing components + 1 shared component that are no
longer referenced by any route after Phases 4 and 5:
- ArchDiagram, CockpitCTA, FeatureStrip, HeroTwoCol, HomePilotCTA,
HowItWorks, PilotHero, PilotSolution, PricingSignal, RiskRemoval,
SocialProof, TheStack, ValueProps, ValuePropsTabs,
FairComparisonSection, DeepAgentsShowcase, LangGraphShowcase,
LibrariesSection, ChatFeaturesSection, ProblemSection,
PilotFooterCTA, WhitePaperGate, PositioningStrip, WhatIsIncluded,
CapabilityCard, GenerativeUIFrame, EmbedFrame, CodeBlock,
CitationBadge, solutions/SolutionsGrid, shared/InstallStrip
- Library subfolders: 7 of 8 components each in angular/, chat-landing/,
render/ (kept only the *CodeShowcase.tsx — still used as visuals in
the new library pages, and they use shiki under the hood)
Kept (still referenced):
- landing/Hero/ProofStrip/Differentiator/FeatureBlock/PilotBlock/
WhitePaperBlock/Promises/HomeFAQ/FinalCTA/LiveCockpitFrame — new
- landing/HighlightedCode — used by the 3 *CodeShowcase components
- landing/WhitePaperSection — still used by /solutions/[slug]
- landing/solutions/Solution{Hero,Problem,Architecture,ProofPoints,
FooterCTA} — still used by /solutions/[slug]
Verification: all 23 e2e tests pass.
Deferred: framer-motion still imported by WhitePaperSection and
/solutions/[slug] components. Final removal of the dep waits on a
focused /solutions/[slug] refactor (out of scope for the current
Statusbrew sweep — those detail pages are data-rich and need their
own pass).
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…-motion /solutions/[slug] page rewritten against Phase 1 primitives: - Hero with per-solution accent color (from solution.color) - PainPoints — Card grid driven by solution.painPoints - Architecture — editorial intro + Card grid for the 3 architecture layers; Agent/Render/Chat cards link to their library page - Capabilities — replaces the old proof-points section; uses the reframed metric/label shape as honest framework claims - WhitePaperBlock (overview) - FinalCTA — now takes optional headline/subtext/primary/secondary/ caption props; solution pages pass their ctaHeadline/ctaSubtext and override the CTA pair to point at /pricing#lead-form + /docs Content updates in solutions-data.ts: - Replaced speculative numeric proof points (10x, 70%, <5min) with honest capability framings (Every / Required / Replayable for compliance; Plain English / Streaming / Inline for analytics; Preserved / Required / Visible for customer support) - Softened overstated language: "immutable audit trails" → audit trail, "Resolve tickets autonomously" → "Resolve routine tickets autonomously" - Tightened a few descriptions to match what the libraries actually do (e.g., dropped "Pre-built generative UI panel" in favor of "Generative UI surfaces") Deletions (now safe): - SolutionHero, SolutionProblem, SolutionArchitecture, SolutionProofPoints, SolutionFooterCTA - WhitePaperSection (its last consumer was /solutions/[slug]) - framer-motion dep removed from package.json + package-lock.json (surgical edit per repo memory: don't regenerate lockfile on macOS) - tokens.glass.border → tokens.surfaces.border swap in the 3 *CodeShowcase components New e2e: apps/website/e2e/solutions.spec.ts covers all 3 slug pages + 404 path + package pill. All 28 e2e tests pass. Remaining `tokens.glass.*` usage is /docs/* only (out of scope per spec — docs styling preserved). Phase 6 token purge of glass / gradient / glow waits on a separate docs refactor pass. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Skin refresh + minor IA polish for apps/website/src/app/docs/** and apps/website/src/components/docs/**. Drops glass/gradient washes, migrates to Phase 1 tokens, wires the unused DocsBreadcrumb + DocsPrevNext, consolidates mdx/Card + mdx/FeatureChips against the ui/Card + ui/Pill primitives, adds hash-anchor affordance on H2/H3. 3-commit phasing. Cockpit (Phase 8) explicitly deferred. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
23-task plan, 3 commits. Commit 7.1 reskins page chrome (landing, slug wrapper, sidebar, search, TOC, breadcrumb, global.css for anchor + 70ch column). Commit 7.2 restyles 7 MDX primitives in place (Callout, Tabs, Steps, CodeGroup, CodeBlock, Card+CardGroup, FeatureChips) — the original spec's consolidation against ui/Card + ui/Pill was dropped after verification showed the MDX primitives have docs-specific shapes. Commit 7.3 handles ancillary components, wires DocsPrevNext, adds heading-anchor affordance, ships a new e2e/docs.spec.ts. Also fixes the FeatureChips broken hrefs (chip links pointed at /docs/guides/... missing the library segment) as part of its restyle. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Migrates docs page chrome to Phase 1 design tokens: - /docs landing rewritten as Hero + library grid + popular topics + search prompt; drops --gradient-bg-flow - slug-page wrapper drops glass + gradient; content well sits on surfaces.surface, page wrapper on surfaces.canvas - DocsSidebar: white surface, hairline right border, no blur - DocsSearch: drop glass on modal; use shadows.lg + surfaces.border - DocsBreadcrumb wired in at top of slug content column (was unused) - DocsTOC: normalized to surfaces tokens - global.css: heading-anchor affordance CSS (used in Phase 7.3) No MDX or content changes. All 28 e2e tests pass. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…Phase 7.2) Restyles 7 MDX primitives in apps/website/src/components/docs/mdx/ to drop glassmorphism and use the Phase 1 token namespaces: - Callout — 4px left accent stripe per tone (tip/warning/info/danger) on surfaceTinted body, with an inline tone-circle icon - Tabs — white tab bar with hairline bottom border; active tab gets 2px accent underline + accent text - Steps — 32x32 accent number circles with surfaces.border vertical connector (matches PilotBlock timeline) - CodeGroup — same tab-bar treatment as Tabs; body wraps the active shiki block in surfaces.border chrome (code body stays tokyo-night) - CodeBlock (the MDX wrapper) — BrowserFrame-style chrome: traffic lights + filename pill, surfaces.surface chrome, code body stays dark - Card / CardGroup — preserved clickable-link-tile shape; drops glass + glow for surfaces tokens + shadows.sm/md - FeatureChips — drops gradient + glass; also fixes 8 broken hrefs (chip links pointed at /docs/guides/... missing the library segment; fixed to /docs/agent/guides/...) No MDX content edits. Prop APIs preserved. All 28 e2e tests pass. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…e 7.2 follow-up)
Phase 7.2's CodeBlock.tsx replacement dropped the copy-to-clipboard
button + docsCopyCodeClick analytics tracking, and replaced the prop
API with { filename, language, children } — a shape the MDX pipeline
never passes (filenames come via rehype-pretty-code's
data-rehype-pretty-code-title attribute, styled in global.css).
This restores Pre's original prop API (React.HTMLAttributes<HTMLPreElement>),
the copy button, and the analytics event. Button styling keeps raw
light-on-dark rgba colors since the button sits on tokyo-night code
background and the new surface tokens would make it invisible.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…(Phase 7.3) - MdxRenderer: H2/H3 component overrides emit a leading `<a class= "heading-anchor">#</a>` linked to the heading's rehype-slug ID. CSS affordance (hover fades the # in) landed in Phase 7.1's global.css. - ApiDocRenderer / ApiRefTable: migrated off tokens.glass.* to surfaces + shadow.sm; param-table headers use surfaceTinted. - ArchFlowDiagram: nodes + edges on surface tokens. - CopyPromptButton: white button with surface border, accent on hover/copied state. - DocsPrevNext: refactored to use ui/Card hoverable; finds siblings by flattening docsConfig.sections.pages in declaration order; wired in at the bottom of every slug page (renders nothing if no siblings exist). - New apps/website/e2e/docs.spec.ts: covers landing page, slug page breadcrumb + prev/next + heading IDs, and the ⌘K search modal. Workspace-wide grep for `tokens.glass` in apps/website/src/app/docs and components/docs returns zero. All e2e tests pass. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…ports - Remove duplicate DocsBreadcrumb render from MdxRenderer (the slug page already renders it; the MdxRenderer-internal render produced two stacked breadcrumbs on every doc page) - Normalize MdxRenderer's tokens import: '../../../lib/design-tokens' (website-local shim) → '@ngaf/design-tokens' (matches every other Phase 7 docs file) - e2e: tighten library-card count + add breadcrumb-once assertion to guard the dedupe fix Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Migrates apps/cockpit to a Linear-style light app shell using the
Phase 1 tokens (surface-tinted sidebar with border-strong divider,
flat mode-switcher pill, hairline-bordered code-file frames, 2px
accent rail on active sidebar nav). Extends libs/ui-react's cssVars
with the new namespaces as a prerequisite.
Final commit deletes the legacy glass/gradients/glow files from
@ngaf/design-tokens AND 9 orphaned glass-using components from
@ngaf/ui-react (workspace grep confirmed nothing consumes them
outside ui-react itself). After Phase 8 ships, the design-tokens
library is at 0.0.31 with a tighter surface; ui-react is a thin
{cssVars, cn} utility.
3 commits: 8.1 prereq + 8.2 cockpit refactor + 8.3 purge.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
20-task plan, 3 commits. Commit 8.1 extends libs/ui-react's cssVars with Phase 1 namespaces (surfaces, shadows, radius, space) plus adds css-vars.spec.ts. Commit 8.2 refactors 9 cockpit files to the new design system (sidebar surface-tinted with border-strong divider, flat mode-switcher, hairline-bordered code frames, 2px accent rail on active sidebar nav). Commit 8.3 deletes glass/gradient/glow files from @ngaf/design-tokens, 8 orphaned glass-using components from @ngaf/ui-react (none consumed outside the lib), and trims website re-exports + global.css :root vars. @ngaf/design-tokens bumps 0.0.30 → 0.0.31. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Adds surfaces / shadows / radius / space CSS vars to the @ngaf/ui-react cssVars map plus extended colors (accentHover, textInverted). Legacy glass / gradient / glow vars stay until Phase 8.3 purge. New libs/ui-react/src/lib/css-vars.spec.ts locks down which vars are exposed; the legacy-namespace assertions will be removed alongside the legacy tokens in Phase 8.3. Also adds @ngaf/design-tokens path alias to tsconfig.base.json (source) and a build-time override in libs/ui-react/tsconfig.lib.json (dist types) so both the Vite test runner and the @nx/js:tsc build executor resolve the package correctly within this worktree. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
Drops glassmorphism and the --ds-gradient-bg-flow body background across the cockpit app. Replaces with the Phase 1 token namespaces: - layout.tsx: body uses --ds-surface - cockpit-shell.tsx: content section --ds-surface, no backdrop-blur; header gets a hairline --ds-border bottom edge - cockpit-sidebar.tsx: --ds-surface-tinted background, --ds-border-strong right edge, no blur - navigation-groups.tsx: active link gets a 2px --ds-accent left rail (devtools convention — Linear, VS Code Explorer) - language-picker.tsx: trigger + dropdown drop glass; dropdown uses --ds-shadow-md - mobile-nav-overlay.tsx: panel uses --ds-surface + --ds-shadow-lg, no blur; inner sub-section borders use --ds-border - mode-switcher.tsx: flat pill (--ds-surface-tinted track + --ds-border outline); sliding indicator keeps --ds-accent - code-mode.tsx: CodeFileContent outer container uses --ds-border + --ds-shadow-sm + --ds-radius-md; dark tokyo-night code header stays - ui/tabs.tsx: tab-list bottom hairline switches to --ds-border; active tab underline stays --ds-accent apps/cockpit grep for glass/gradient/backdrop returns zero. All cockpit tests + cockpit e2e + website e2e green. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
…mponents (Phase 8.3)
Final cleanup of the multi-phase Statusbrew-inspired refactor.
@ngaf/design-tokens (bumped 0.0.30 → 0.0.31):
- Deleted libs/design-tokens/src/lib/glass.ts
- Deleted libs/design-tokens/src/lib/gradients.ts
- Deleted libs/design-tokens/src/lib/glow.ts
- tokens.ts aggregator drops glass/gradient/glow
- tokens.css drops --ds-glass-*, --ds-gradient-*, --ds-glow-*
- tokens.spec.ts drops the corresponding test blocks
- index.ts trimmed
@ngaf/ui-react becomes a thin {cssVars, cn} utility lib:
- Deleted 8 orphaned glass-using components (GlassPanel, GlassButton,
Card, CardGroup, CodeGroup, Callout, Steps, Tabs, NavLink) — none
were consumed outside libs/ui-react itself
- Deleted components.spec.tsx (tested the deleted components)
- index.ts trimmed to {cssVars, cn}
- css-vars.ts no longer exposes legacy --ds-glass-*/--ds-gradient-*/
--ds-glow-* vars
- css-vars.spec.ts assertions consolidated
Website-side cleanup:
- apps/website/lib/design-tokens.ts: drop glass/gradient/glow re-exports
- apps/website/src/app/global.css: drop legacy :root vars
- apps/website/src/components/pricing/CompareTable.tsx: migrate from
tokens.glass to tokens.surfaces (missed in Phase 7)
Workspace-wide grep for tokens.glass / tokens.gradient / tokens.glow /
--ds-glass / --ds-gradient / --ds-glow / --glass- / --gradient-bg-flow
returns zero. All tests green: design-tokens, ui-react, cockpit,
website (e2e + unit).
Multi-phase Statusbrew refactor complete.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
2 tasks
blove
added a commit
that referenced
this pull request
May 12, 2026
PR #270 introduced WhitePaperBlock.tsx with surface: 'home_whitepaper' without updating the AnalyticsSurface type, causing builds to fail on every PR rebased on top of it. One-line union addition. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
blove
added a commit
that referenced
this pull request
May 12, 2026
…Attrs
The 'rest as AnchorButtonProps' cast on line 115 contradicted the prior
destructure on line 106 that pulled 'href' out — TS then inferred that
anchorAttrs still had 'href', conflicting with the explicit href={href}
JSX prop. Result: TS2783 'href is specified more than once' build
failure since the Statusbrew website refactor (#270).
Removing the redundant cast lets TS infer anchorAttrs from the runtime-
true type (rest without href).
blove
added a commit
that referenced
this pull request
May 13, 2026
#274) * fix(website): add 'home_whitepaper' to AnalyticsSurface WhitePaperBlock.tsx passes 'home_whitepaper' as the surface property when tracking signup submissions, but the AnalyticsSurface union did not include that value — causing TS2322 build failures on main since the Statusbrew website refactor landed (#270). This is blocking unrelated PRs from merging because Website lint is a required check. * fix(website): remove redundant cast that re-introduces href on anchorAttrs The 'rest as AnchorButtonProps' cast on line 115 contradicted the prior destructure on line 106 that pulled 'href' out — TS then inferred that anchorAttrs still had 'href', conflicting with the explicit href={href} JSX prop. Result: TS2783 'href is specified more than once' build failure since the Statusbrew website refactor (#270). Removing the redundant cast lets TS infer anchorAttrs from the runtime- true type (rest without href).
2 tasks
blove
added a commit
that referenced
this pull request
May 13, 2026
… commitment (Group A) (#275) Two factual changes flagged in PR #270 for review before final ship: 1. Drop "zoneless" mentions sitewide. - HomeFAQ: remove "Is it zoneless-compatible?" question; remove "zoneless support" from the "How is this different…" answer. - Promises: nothing here mentioned zoneless directly. - ProofStrip: replace "Built for Angular 20+ / Zoneless ready" with "Built for / Angular 20+". - /angular page: drop "zoneless-safe signals" from the hero subhead, "zoneless-safe handle" from the Providers feature-block body, the "Zoneless ready" Pill from the trust row, and "+ zoneless" from the "OnPush + zoneless tested" bullet. 2. Soften the Angular LTS commitment to what we can actually hold. - Promises #3 ("No abandoned majors"): was "We follow Angular's LTS. When Angular ships, we ship." → now "We support Angular's current and previous LTS versions." - HomeFAQ Q "Is this production-ready today?": was "...We track Angular's release cadence and ship against current and one previous major." → now "...We support Angular's current and previous LTS versions." Other drafts flagged in the PR (ProofStrip "LangChain Awesome", solutions-data speculative metrics) were already honest in the shipped code — no changes needed. All 35 website e2e tests pass. Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>
Merged
4 tasks
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
Multi-phase migration of the website + cockpit from glassmorphism to a Statusbrew-inspired SaaS aesthetic. Net -403 lines across Phase 8 alone; ~7,600 lines of orphaned landing components deleted earlier in the sweep.
Phase 1 — Added 4 new token namespaces to
@ngaf/design-tokens(surfaces,shadows,radius,space) plus 9 UI primitives inapps/website/src/components/ui/(Container,Section,Eyebrow,Pill,Button,Card,BrowserFrame,LogoMark,FAQ). Additive — no breaking changes.Phase 2 — Refactored
Nav,Footer,AnnouncementToast. Removed glass + framer-motion from the shell.Phase 4 — Rebuilt homepage to a dev-first 11-section IA: Hero collage, ProofStrip, Differentiator, Stream/Render/Ship FeatureBlocks (with live cockpit iframe in Ship), PilotBlock, WhitePaperBlock, Promises, HomeFAQ, FinalCTA.
Phase 5 — Migrated 6 marketing routes:
/pricing,/pilot-to-prod,/angular,/chat,/render,/solutions.WhitePaperBlockparameterized for per-library PDFs.Phase 6 — Deleted 51 orphaned landing components (7,617 lines).
Phase 7 — Docs skin refresh + minor IA polish (
/docs/**). Wired inDocsBreadcrumbandDocsPrevNext(were unused). Hash-anchor affordance on H2/H3. 7 MDX primitives restyled in place. Solutions detail pages (/solutions/[slug]) rewritten — reframed speculative metric claims (e.g.10x faster time-to-insight) as honest framework capabilities. Removedframer-motiondependency.Phase 8 — Migrated
apps/cockpit/**to Linear-style light app shell (surface-tinted sidebar,border-strongdivider, flat mode-switcher pill, 2px accent rail on active sidebar nav). Deleted legacyglass.ts/gradients.ts/glow.tsfrom@ngaf/design-tokensand 8 orphaned glass-using components from@ngaf/ui-react. Bumped@ngaf/design-tokensto 0.0.31 per patch-only policy.After this PR, workspace grep for
tokens\.glass|tokens\.gradient|tokens\.glow|--ds-glass|--ds-gradient|--ds-glow|--glass-|--gradient-bg-flowacrossapps/+libs/returns zero.Test plan
pnpm nx e2e website— 35 passed (6 new tests ine2e/docs.spec.ts+ 5 new ine2e/solutions.spec.ts+ 10 new ine2e/primitives.spec.ts+ 14 pre-existing)pnpm nx e2e cockpit— 3 passedpnpm nx test design-tokens— green (new namespace assertions added; legacy ones removed in 8.3)pnpm nx test ui-react— green (newcss-vars.spec.tscovers Phase 1 namespaces)pnpm nx test cockpit— green/Items flagged in the original specs for review before final ship
These shipped as drafts and were called out in the spec for human revision:
HomeFAQ.tsx) — drafted; the zoneless-compatibility claims especially need verification.ProofStrip.tsx) — "Listed on LangChain Awesome" claim needs verification or swap.10x faster time-to-insight,70% tickets resolved autonomously. Replaced with framework-grounded claims; review tone.Deferred
BrowserFrames currently render inline placeholder UI; the livecockpit.cacheplane.aiiframe powers the one "signature demo" section/pilot-to-prod🤖 Generated with Claude Code