style: update MDX component headings to use heading-xl/lg/md utilities

This commit is contained in:
2026-06-01 21:34:04 -05:00
parent 0a1032d1ee
commit a65740ea2c

View File

@@ -5,17 +5,17 @@ export function useMDXComponents(components: MDXComponents): MDXComponents {
...components,
// Typography
h1: (props) => (
<h1 {...props} className="scroll-m-20 font-sans text-4xl font-extrabold tracking-tight lg:text-5xl mt-10 mb-4 text-ink">
<h1 {...props} className="scroll-m-20 heading-xl text-ink mt-10 mb-4">
{props.children}
</h1>
),
h2: (props) => (
<h2 {...props} className="scroll-m-20 border-b border-border pb-2 font-sans text-3xl font-semibold tracking-tight mt-12 mb-4 first:mt-0 text-ink">
<h2 {...props} className="scroll-m-20 border-b border-border pb-2 heading-lg text-ink mt-12 mb-4 first:mt-0">
{props.children}
</h2>
),
h3: (props) => (
<h3 {...props} className="scroll-m-20 font-sans text-2xl font-semibold tracking-tight mt-8 mb-3 text-ink">
<h3 {...props} className="scroll-m-20 heading-md text-ink mt-8 mb-3">
{props.children}
</h3>
),