style: add VS Code tree view for doc sidebar and improve typography

This commit is contained in:
2026-03-18 19:26:46 +08:00
parent 683b3d66ab
commit c3ecebea89
2 changed files with 116 additions and 63 deletions

View File

@@ -11,7 +11,7 @@ export const DocContent = ({ content, onReferenceClick }: DocContentProps) => {
if (!content) {
return (
<div className="flex items-center justify-center h-full text-zinc-500">
<p className="text-sm"></p>
<p className="text-base"></p>
</div>
)
}
@@ -44,19 +44,19 @@ export const DocContent = ({ content, onReferenceClick }: DocContentProps) => {
)
}
return (
<code className="text-zinc-300 font-mono text-sm" {...props}>
<code className="text-zinc-300 font-mono text-base" {...props}>
{children}
</code>
)
},
pre: ({ children }) => (
<pre className="bg-zinc-900 rounded-lg p-4 overflow-x-auto my-6 text-sm leading-relaxed">
<pre className="bg-zinc-900 rounded-lg p-4 overflow-x-auto my-6 text-base leading-relaxed">
{children}
</pre>
),
table: ({ children }) => (
<div className="overflow-x-auto my-6">
<table className="w-full text-sm">
<table className="w-full text-base">
{children}
</table>
</div>
@@ -87,22 +87,22 @@ export const DocContent = ({ content, onReferenceClick }: DocContentProps) => {
</h1>
),
h2: ({ children }) => (
<h2 className="text-xl font-semibold text-white mt-10 mb-4">
<h2 className="text-2xl font-semibold text-white mt-10 mb-4">
{children}
</h2>
),
h3: ({ children }) => (
<h3 className="text-lg font-medium text-zinc-200 mt-8 mb-3">
<h3 className="text-xl font-medium text-zinc-200 mt-8 mb-3">
{children}
</h3>
),
h4: ({ children }) => (
<h4 className="text-base font-medium text-zinc-300 mt-6 mb-2">
<h4 className="text-lg font-medium text-zinc-300 mt-6 mb-2">
{children}
</h4>
),
p: ({ children }) => (
<p className="text-zinc-400 leading-relaxed my-4">
<p className="text-base text-zinc-400 leading-relaxed my-4">
{children}
</p>
),