From f288302fcaf9c0d40013a69fc177c9d95b7668e7 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Sat, 21 Mar 2026 21:10:31 +0000
Subject: [PATCH] Fix code tab jumping: shorten Vercel snippet, lock container
 height

Condense Vercel AI snippet from 19 to 13 lines by dropping optional
metadata arg. Change .code-block from min-height to fixed height so
switching tabs never causes layout shift.

https://claude.ai/code/session_01TF7Pksn82FUivsvg9bm7Rw
---
 .vitepress/theme/HomeCodeSnippet.vue | 16 +++++-----------
 1 file changed, 5 insertions(+), 11 deletions(-)

diff --git a/.vitepress/theme/HomeCodeSnippet.vue b/.vitepress/theme/HomeCodeSnippet.vue
index 110b83b..2ce070d 100644
--- a/.vitepress/theme/HomeCodeSnippet.vue
+++ b/.vitepress/theme/HomeCodeSnippet.vue
@@ -84,14 +84,8 @@ const handle = await reserveForStream({
 
 const result = streamText({
   model: openai("gpt-4o"), messages,
-  onFinish: async ({ usage }) => {
-    const actual = (usage.promptTokens ?? 0) * 250
-      + (usage.completionTokens ?? 0) * 1000;
-    await handle.commit(actual, {
-      tokensInput: usage.promptTokens,
-      tokensOutput: usage.completionTokens,
-    });
-  },
+  onFinish: async ({ usage }) =>
+    handle.commit((usage.promptTokens ?? 0) * 250 + (usage.completionTokens ?? 0) * 1000),
 });`,
   },
 
@@ -278,9 +272,9 @@ onMounted(async () => {
   background: var(--vp-code-block-bg);
   padding: 20px 24px;
   overflow-x: auto;
-  /* Fixed height prevents layout shift when switching tabs.
-     Tallest snippet (Vercel AI) is ~17 lines × 14px × 1.6 + 40px padding */
-  min-height: 420px;
+  /* Fixed height prevents layout shift when switching tabs */
+  height: 420px;
+  overflow-y: auto;
 }
 
 .code-block :deep(pre) {