docs: fix sidebar overflow at mid-width viewports and add a favicon (#2426)

Author: maxisbey

docs/.vitepress/config.mts

@@ -30,6 +30,8 @@ export default defineConfig({
     title: 'MCP TypeScript SDK',
     description: 'The TypeScript SDK implementation of the Model Context Protocol specification.',
     base: '/v2/',
+    // VitePress does not base-prefix head hrefs, so /v2/ is spelled out here.
+    head: [['link', { rel: 'icon', type: 'image/svg+xml', href: '/v2/favicon.svg' }]],
     srcExclude: ['v1/**', '_meta/**', 'behavior-surface-pins.md'],
     sitemap: { hostname: `${siteUrl}/` },
     markdown: {

docs/.vitepress/theme/custom.css

@@ -13,9 +13,16 @@
  * which forces horizontal scrolling on most of our ~100-column code blocks.
  * Let the layout breathe and the column grow so typical snippets fit;
  * genuinely long lines still scroll inside their own block.
+ *
+ * Clamped to the viewport because the default theme's `(min-width: 1440px)`
+ * rules size the sidebar and nav title as
+ * `calc((100% - (var(--vp-layout-max-width) - 64px)) / 2 + ...)`, which goes
+ * negative on viewports narrower than the max width: the sidebar collapses
+ * and the site title spills over the search bar. With the clamp, those rules
+ * resolve to their stock sub-1440px values on narrower viewports instead.
  */
 :root {
-    --vp-layout-max-width: 1680px;
+    --vp-layout-max-width: min(100vw, 1680px);
 }
 
 /* !important: the default rule is a scoped component style ([data-v-…]), which

docs/public/favicon.svg

@@ -24,6 +24,9 @@ export default defineConfig({
     title: 'MCP TypeScript SDK (v1)',
     description: 'Documentation for v1.x of the MCP TypeScript SDK.',
     base: '/',
+    // The favicon is copied into content/public/ by scripts/build-docs-site.sh
+    // (content/ is generated; the committed source is docs/public/favicon.svg).
+    head: [['link', { rel: 'icon', type: 'image/svg+xml', href: '/favicon.svg' }]],
     sitemap: { hostname: 'https://ts.sdk.modelcontextprotocol.io' },
     srcDir: 'content',
     markdown: {

docs/v1/.vitepress/config.mts

@@ -99,6 +99,10 @@ npx typedoc --options typedoc.v1-site.json
 cp docs/*.md "$V1_CONTENT/"
 cp README.md "$V1_CONTENT/index.md"
 
+# The v1 site serves the shared favicon at its own root (see docs/v1/.vitepress/config.mts).
+mkdir -p "$V1_CONTENT/public"
+cp "$REPO_ROOT/docs/public/favicon.svg" "$V1_CONTENT/public/favicon.svg"
+
 # Rewrite links that don't resolve on the site:
 # - source files -> GitHub
 # - README links into docs/ -> site-local pages (docs/*.md sit next to index.md in content/)