fix height problems

src/app/cv/page.tsx

@@ -1,11 +1,42 @@
-import { Suspense } from "react";
+import { Suspense, type ReactNode } from "react";
+import { MDXRemote } from "next-mdx-remote/rsc";
+import rehypeHighlight from "rehype-highlight";
+import remarkGfm from "remark-gfm";
 import { servTrpc as trpc } from "../_trpc/ServerClient";
+import { mdxComponents } from "~/components/mdx-components";
 import Page from "./_components/Page";
+
 export default async function CvPage() {
   const cv = await trpc.categoryv2.listAllWithEntries();
+
+  // Render the MDX descriptions on the server so they exist at first paint.
+  // The client tree (which runs the GSAP entrance via useTimeLine) only places
+  // these already-rendered nodes — it never invokes the MDX renderer itself, so
+  // the 'use client' boundary stays intact and the animations no longer play
+  // against an un-rendered fallback.
+  const descriptions: Record<string, ReactNode> = {};
+  for (const category of cv ?? []) {
+    for (const entry of category.cvEntry) {
+      if (!entry.description?.trim()) continue;
+      descriptions[entry.id] = (
+        <MDXRemote
+          source={entry.description}
+          components={mdxComponents}
+          options={{
+            mdxOptions: {
+              format: "md",
+              remarkPlugins: [remarkGfm],
+              rehypePlugins: [rehypeHighlight],
+            },
+          }}
+        />
+      );
+    }
+  }
+
   return (
     <Suspense>
-      <Page cv={cv}/>
+      <Page cv={cv} descriptions={descriptions} />
     </Suspense>
   )
 }