From 4c0a9c495d0066a12e600183044566a717f69fc0 Mon Sep 17 00:00:00 2001
From: tszhong0411 <me@honghong.me>
Date: Thu, 6 Feb 2025 13:43:54 +0800
Subject: [PATCH] fix(ui): fix typography of anchor in heading

---
 .changeset/flat-maps-lick.md             |  5 +++++
 apps/docs/src/components/mdx/heading.tsx |  2 +-
 apps/web/src/components/mdx/heading.tsx  |  2 +-
 packages/ui/styles/typography.css        | 14 ++++++++++++++
 4 files changed, 21 insertions(+), 2 deletions(-)
 create mode 100644 .changeset/flat-maps-lick.md

diff --git a/.changeset/flat-maps-lick.md b/.changeset/flat-maps-lick.md
new file mode 100644
index 00000000..023d884a
--- /dev/null
+++ b/.changeset/flat-maps-lick.md
@@ -0,0 +1,5 @@
+---
+'@tszhong0411/ui': patch
+---
+
+Fix typography of anchor in heading
diff --git a/apps/docs/src/components/mdx/heading.tsx b/apps/docs/src/components/mdx/heading.tsx
index ed176e76..154c060a 100644
--- a/apps/docs/src/components/mdx/heading.tsx
+++ b/apps/docs/src/components/mdx/heading.tsx
@@ -19,7 +19,7 @@ const Heading = <T extends Types = 'h1'>(props: HeadingProps<T>) => {
 
   return (
     <Component className={cn('scroll-m-32', className)} id={id} {...rest}>
-      <a href={`#${id}`} className='not-prose group'>
+      <a href={`#${id}`} className='group'>
         {children}
         <LinkIcon
           aria-label='Link to section'
diff --git a/apps/web/src/components/mdx/heading.tsx b/apps/web/src/components/mdx/heading.tsx
index a9c4178f..48904561 100644
--- a/apps/web/src/components/mdx/heading.tsx
+++ b/apps/web/src/components/mdx/heading.tsx
@@ -21,7 +21,7 @@ const Heading = <T extends Types = 'h1'>(props: HeadingProps<T>) => {
 
   return (
     <Component className={cn('scroll-m-32', className)} id={id} {...rest}>
-      <a href={`#${id}`} className='not-prose group'>
+      <a href={`#${id}`} className='group'>
         {children}
         <LinkIcon
           aria-label={t('mdx.link-to-section')}
diff --git a/packages/ui/styles/typography.css b/packages/ui/styles/typography.css
index 603fa686..9ad37cd3 100644
--- a/packages/ui/styles/typography.css
+++ b/packages/ui/styles/typography.css
@@ -52,4 +52,18 @@
     margin-top: 16px;
     margin-bottom: 16px;
   }
+
+  :is(
+    :where(h1, h2, h3, h4, h5, h6, th):not(:where([class~='not-prose'], [class~='not-prose'] *))
+  ) {
+    & a {
+      text-decoration: none;
+      font-weight: inherit;
+      color: inherit;
+    }
+
+    & code {
+      font-size: inherit;
+    }
+  }
 }