From c4f0db5719e629b5c0e9b45f056c2c5cf2ba0d00 Mon Sep 17 00:00:00 2001
From: Marco Sadjadi <marco@buildmymcpserver.local>
Date: Wed, 8 Jul 2026 23:13:53 +0200
Subject: [PATCH] =?UTF-8?q?fix(review):=20loop-2=20findings=20=E2=80=94=20?=
 =?UTF-8?q?login=20fallback,=20proof-band=20confidence,=20contrast,=20cont?=
 =?UTF-8?q?ent=20hedges?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Code review: login no longer strands visitors with zero sign-in methods when
the providers fetch fails (falls back to SMS + error notice); skeleton while
providers load instead of a blank card.

Design re-audit: proof band flipped from apology to flex ('Don't take our
word for it / Every claim links to its proof') and promoted to the primary
heading tier; unverifiable '60 seconds'/'in minutes' speed claims dropped;
fg-subtle body text bumped to fg-muted (AA contrast); marketplace section
differentiated via border-y + elevated bg (adjacent hairlines removed);
preview frame traffic lights on-palette; header h-12 -> h-14 (hero svh calc
adjusted); emerald-400 -> --color-success token.

Content QA: rest-api article description drift between page and registry
resolved; ChatGPT plan-gating table and Atlassian Rovo SSE-cutoff claims now
carry dated hedges.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01SXUwmPVRTD8AKQtio6gCN5
---
 .../guides/chatgpt-mcp-connector/page.tsx     |  4 +-
 .../guides/mcp-transports-explained/page.tsx  |  3 +-
 apps/web/app/(marketing)/layout.tsx           | 10 ++--
 apps/web/app/(marketing)/page.tsx             | 48 ++++++++++---------
 apps/web/app/login/page.tsx                   | 22 ++++++++-
 apps/web/lib/articles.ts                      |  2 +-
 6 files changed, 57 insertions(+), 32 deletions(-)

diff --git a/apps/web/app/(marketing)/guides/chatgpt-mcp-connector/page.tsx b/apps/web/app/(marketing)/guides/chatgpt-mcp-connector/page.tsx
index 18a06ba..477f33c 100644
--- a/apps/web/app/(marketing)/guides/chatgpt-mcp-connector/page.tsx
+++ b/apps/web/app/(marketing)/guides/chatgpt-mcp-connector/page.tsx
@@ -38,7 +38,9 @@ export default function Page() {
         <H2>The plan limits, first — because they decide everything</H2>
         <P>
           Before writing a single prompt or line of code, check what your ChatGPT plan allows.
-          OpenAI gates custom MCP connectors by workspace type:
+          As of mid-2026, OpenAI gates custom MCP connectors by workspace type — verify against
+          OpenAI&apos;s current help docs before committing to a plan, since these limits have
+          shifted before:
         </P>
         <Table>
           <thead>
diff --git a/apps/web/app/(marketing)/guides/mcp-transports-explained/page.tsx b/apps/web/app/(marketing)/guides/mcp-transports-explained/page.tsx
index 156a76b..925e655 100644
--- a/apps/web/app/(marketing)/guides/mcp-transports-explained/page.tsx
+++ b/apps/web/app/(marketing)/guides/mcp-transports-explained/page.tsx
@@ -129,7 +129,8 @@ export default function Page() {
           Spec revision <Strong>2025-03-26</Strong> replaced HTTP+SSE with Streamable HTTP. The old
           transport still works where both sides keep supporting it, but the direction is one-way:
           platforms have been announcing removal dates through 2026 — Atlassian's Rovo MCP server,
-          for example, set its HTTP+SSE cutoff for June 30, 2026. New servers should not ship it.
+          for example, announced an HTTP+SSE cutoff of June 30, 2026. New servers should not ship
+          it.
         </P>
 
         <H2>Streamable HTTP: the current standard</H2>
diff --git a/apps/web/app/(marketing)/layout.tsx b/apps/web/app/(marketing)/layout.tsx
index 6746330..24edca6 100644
--- a/apps/web/app/(marketing)/layout.tsx
+++ b/apps/web/app/(marketing)/layout.tsx
@@ -8,7 +8,7 @@ export default function MarketingLayout({ children }: { children: React.ReactNod
   return (
     <div className="flex min-h-screen flex-col">
       <header className="sticky top-0 z-50 border-b border-[--color-border] bg-[--color-bg]/80 backdrop-blur-md">
-        <div className="mx-auto flex h-12 max-w-6xl items-center justify-between px-5 sm:px-6">
+        <div className="mx-auto flex h-14 max-w-6xl items-center justify-between px-5 sm:px-6">
           <div className="flex items-center gap-6">
             <Logo />
             <nav className="hidden items-center gap-5 text-[13px] text-[--color-fg-muted] md:flex">
@@ -45,15 +45,15 @@ export default function MarketingLayout({ children }: { children: React.ReactNod
             {/* Brand column — positioning line + live status. */}
             <div className="sm:col-span-2 md:col-span-1">
               <Logo />
-              <p className="mt-3 max-w-xs text-[12.5px] leading-relaxed text-[--color-fg-subtle]">
+              <p className="mt-3 max-w-xs text-[12.5px] leading-relaxed text-[--color-fg-muted]">
                 From a prompt to a hosted, OAuth-protected MCP server — for Claude, Cursor and
                 ChatGPT.
               </p>
               <Link
                 href="/status"
-                className="mt-4 flex items-center gap-2 text-[12px] text-[--color-fg-subtle] transition-colors hover:text-[--color-fg]"
+                className="mt-4 flex items-center gap-2 text-[12px] text-[--color-fg-muted] transition-colors hover:text-[--color-fg]"
               >
-                <span className="size-1.5 animate-pulse rounded-full bg-emerald-400" />
+                <span className="size-1.5 animate-pulse rounded-full bg-[--color-success]" />
                 <span>System status</span>
               </Link>
             </div>
@@ -107,7 +107,7 @@ function FooterColumn({
       <h3 className="text-[11px] font-semibold uppercase tracking-[0.16em] text-[--color-fg-muted]">
         {title}
       </h3>
-      <ul className="mt-3 space-y-2 text-[12.5px] text-[--color-fg-subtle]">
+      <ul className="mt-3 space-y-2 text-[12.5px] text-[--color-fg-muted]">
         {links.map((l) => (
           <li key={l.href}>
             <Link href={l.href} className="transition-colors hover:text-[--color-fg]">
diff --git a/apps/web/app/(marketing)/page.tsx b/apps/web/app/(marketing)/page.tsx
index 183037a..a6f6802 100644
--- a/apps/web/app/(marketing)/page.tsx
+++ b/apps/web/app/(marketing)/page.tsx
@@ -164,7 +164,7 @@ export default function Landing() {
           CTAs stay interactive. */}
       <section
         className="relative flex items-center overflow-hidden border-b border-[--color-border]"
-        style={{ minHeight: 'calc(100svh - 3rem)' }}
+        style={{ minHeight: 'calc(100svh - 3.5rem)' }}
       >
         <ParticleHero />
         <div className="relative z-10 mx-auto grid w-full max-w-6xl gap-10 px-6 py-14 sm:py-20 md:grid-cols-[1.05fr_1fr] md:items-center md:gap-12">
@@ -177,8 +177,8 @@ export default function Landing() {
               <span className="text-[--color-fg-muted]">AI uses it.</span>
             </h1>
             <p className="mt-5 max-w-md text-[15px] leading-relaxed text-[--color-fg-muted] sm:text-[16px]">
-              From prompt to production MCP server in 60 seconds. OAuth 2.1, Streamable HTTP, ready
-              for Claude, Cursor and ChatGPT.
+              From a prompt to a production MCP server — OAuth 2.1, Streamable HTTP, ready for
+              Claude, Cursor and ChatGPT.
             </p>
             <div className="mt-8 flex flex-wrap items-center gap-3">
               <PulseLink
@@ -191,21 +191,21 @@ export default function Landing() {
                 href="#flow"
                 className="inline-flex h-11 items-center justify-center rounded-md border border-[--color-border] bg-[--color-bg-elevated] px-5 text-[14px] text-[--color-fg-muted] transition-colors hover:text-[--color-fg]"
               >
-                See a live build
+                Watch a build
               </PulseLink>
             </div>
-            <div className="mt-8 flex flex-wrap gap-x-6 gap-y-2 text-[12px] text-[--color-fg-subtle]">
+            <div className="mt-8 flex flex-wrap gap-x-6 gap-y-2 text-[12px] text-[--color-fg-muted]">
               <span className="inline-flex items-center gap-1.5">
-                <span className="size-1.5 rounded-full bg-emerald-400" /> OAuth 2.1 + PKCE
+                <span className="size-1.5 rounded-full bg-[--color-success]" /> OAuth 2.1 + PKCE
               </span>
               <span className="inline-flex items-center gap-1.5">
-                <span className="size-1.5 rounded-full bg-emerald-400" /> Streamable HTTP
+                <span className="size-1.5 rounded-full bg-[--color-success]" /> Streamable HTTP
               </span>
               <span className="inline-flex items-center gap-1.5">
-                <span className="size-1.5 rounded-full bg-emerald-400" /> AES-256 secrets
+                <span className="size-1.5 rounded-full bg-[--color-success]" /> AES-256 secrets
               </span>
               <span className="inline-flex items-center gap-1.5">
-                <span className="size-1.5 rounded-full bg-emerald-400" /> Per-server isolation
+                <span className="size-1.5 rounded-full bg-[--color-success]" /> Per-server isolation
               </span>
             </div>
           </div>
@@ -290,13 +290,13 @@ export default function Landing() {
       {/* Proof by specificity — three verifiable claims, each one click from
           its evidence. Replaces the old pseudo-logo row: no invented marks,
           just a plain-text compatibility line. */}
-      <section className="border-b border-[--color-border] py-16 sm:py-24">
+      <section className="py-16 sm:py-24">
         <div className="mx-auto max-w-6xl px-6">
           <Kicker>verify_it_yourself</Kicker>
-          <h2 className="mt-3 max-w-2xl text-[28px] font-semibold leading-[1.1] tracking-tight sm:text-[32px]">
-            No testimonials yet — we're new.
+          <h2 className="mt-3 max-w-2xl text-[32px] font-semibold leading-[1.1] tracking-tight sm:text-[40px]">
+            Don&apos;t take our word for it.
             <br />
-            <span className="text-[--color-fg-muted]">So check the claims instead.</span>
+            <span className="text-[--color-fg-muted]">Every claim links to its proof.</span>
           </h2>
           <div className="mt-10 grid gap-4 md:grid-cols-3">
             {PROOF_POINTS.map((p) => {
@@ -319,15 +319,16 @@ export default function Landing() {
               );
             })}
           </div>
-          <p className="mt-10 text-center text-[13px] text-[--color-fg-subtle]">
+          <p className="mt-10 text-center text-[13px] text-[--color-fg-muted]">
             Works with Claude Desktop, Cursor, ChatGPT, VS Code Copilot and Continue.dev — anything
             that speaks MCP.
           </p>
         </div>
       </section>
 
-      {/* Use cases — brand-coloured integration grid. */}
-      <section className="border-b border-[--color-border] py-20 sm:py-28">
+      {/* Use cases — brand-coloured integration grid. No bottom hairline:
+          the marketplace section below brings its own border-y. */}
+      <section className="py-20 sm:py-28">
         <div className="mx-auto max-w-6xl px-6">
           <div className="mb-12 grid gap-6 md:grid-cols-[1fr_auto] md:items-end md:gap-12">
             <div>
@@ -335,11 +336,11 @@ export default function Landing() {
               <h2 className="mt-3 text-[32px] font-semibold leading-[1.1] tracking-tight sm:text-[40px]">
                 Wrap any HTTP API.
                 <br />
-                <span className="text-[--color-fg-muted]">In minutes.</span>
+                <span className="text-[--color-fg-muted]">From one prompt.</span>
               </h2>
             </div>
             <p className="max-w-xs text-[14px] leading-relaxed text-[--color-fg-muted]">
-              Ship integrations like these from one prompt each.
+              Each shipped from a single prompt.
             </p>
           </div>
 
@@ -375,8 +376,9 @@ export default function Landing() {
       </section>
 
       {/* Marketplace — split layout: selling points left, honest preview
-          frame right. */}
-      <section className="border-b border-[--color-border] py-20 sm:py-28">
+          frame right. Elevated background (no hairline) so the page reads
+          in blocks instead of one continuously ruled ledger. */}
+      <section className="border-y border-[--color-border] bg-[--color-bg-elevated] py-20 sm:py-28">
         <div className="mx-auto grid max-w-6xl gap-14 px-6 md:grid-cols-[5fr_6fr] md:items-center md:gap-16">
           <div>
             <Kicker>marketplace</Kicker>
@@ -602,9 +604,9 @@ function MarketplacePreview() {
       {/* Browser chrome */}
       <div className="flex items-center gap-3 border-b border-[--color-border] bg-[--color-bg-subtle] px-4 py-3">
         <div className="flex gap-1.5">
-          <span className="size-2.5 rounded-full bg-zinc-700" />
-          <span className="size-2.5 rounded-full bg-zinc-700" />
-          <span className="size-2.5 rounded-full bg-zinc-700" />
+          <span className="size-2.5 rounded-full bg-[#ff5f57]/80" />
+          <span className="size-2.5 rounded-full bg-[#febc2e]/80" />
+          <span className="size-2.5 rounded-full bg-[#28c840]/80" />
         </div>
         <div className="mono flex-1 truncate rounded-md border border-[--color-border] bg-[--color-bg] px-3 py-1 text-[11px] text-[--color-fg-subtle]">
           buildmymcpserver.com/templates
diff --git a/apps/web/app/login/page.tsx b/apps/web/app/login/page.tsx
index d28227c..7417786 100644
--- a/apps/web/app/login/page.tsx
+++ b/apps/web/app/login/page.tsx
@@ -208,6 +208,7 @@ export default function LoginPage() {
   // product should never see a phone-number field as the front door. It only
   // renders expanded when SMS is the sole configured provider.
   const [phoneOpen, setPhoneOpen] = useState(false);
+  const [providersState, setProvidersState] = useState<'loading' | 'ready' | 'failed'>('loading');
   const [error, setError] = useState<string | null>(null);
 
   // Email magic-link
@@ -228,11 +229,21 @@ export default function LoginPage() {
     )
       .then((p) => {
         setProviders(p);
+        setProvidersState('ready');
         // SMS as the only provider → show the phone form directly (no point
         // hiding the sole sign-in method behind a toggle).
         if (p.sms && !p.email && !p.google && !p.github) setPhoneOpen(true);
       })
-      .catch(() => undefined);
+      .catch(() => {
+        // If the providers lookup fails, the page must not strand the visitor
+        // with zero sign-in methods — fall back to SMS + phone form expanded
+        // (the one flow that has no provider-specific client config) and say
+        // why the other options are missing.
+        setProviders({ google: false, github: false, sms: true, email: false });
+        setPhoneOpen(true);
+        setProvidersState('failed');
+        setError('Some sign-in options could not be loaded. Reload the page to try again.');
+      });
     const err = new URLSearchParams(window.location.search).get('error');
     if (err) setError(ERROR_COPY[err] ?? 'Sign-in failed. Please try again.');
   }, []);
@@ -296,6 +307,15 @@ export default function LoginPage() {
           Passwordless — pick whichever is easiest.
         </p>
 
+        {/* Providers still loading → neutral skeleton instead of a blank card
+            (previously nothing rendered until the fetch resolved). */}
+        {providersState === 'loading' && (
+          <div aria-hidden className="mt-7 space-y-2">
+            <div className="h-10 w-full animate-pulse rounded-md bg-[--color-bg-elevated]" />
+            <div className="h-10 w-full animate-pulse rounded-md bg-[--color-bg-elevated]" />
+          </div>
+        )}
+
         {hasOAuth && (
           <div className="mt-7 space-y-2">
             {providers.google && (
diff --git a/apps/web/lib/articles.ts b/apps/web/lib/articles.ts
index 82f3337..dc006d8 100644
--- a/apps/web/lib/articles.ts
+++ b/apps/web/lib/articles.ts
@@ -43,7 +43,7 @@ export const ARTICLES: Article[] = [
     slug: 'rest-api-to-mcp-server',
     title: 'Wrap any REST API as an MCP server',
     description:
-      'How to turn a REST API into an MCP server your AI clients can use: designing the tool surface, handling auth headers with encrypted secrets, and respecting upstream rate limits.',
+      'How to turn a REST API into an MCP server your AI clients can use: designing the tool surface (fewer, better tools beat 1:1 endpoint mapping), handling auth headers with encrypted secrets, and respecting upstream rate limits.',
     tag: 'Guide',
     datePublished: '2026-07-08',
   },