improve anchor for headings

AREA44 · Jun 6, 2024 · 60e9cc3 · 60e9cc3
1 parent 10f1d1c
commit 60e9cc3
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 6 deletions.
diff --git a/src/content/docs/guides/anchor-links-for-headings.mdx b/src/content/docs/guides/anchor-links-for-headings.mdx
@@ -45,8 +45,9 @@ This is guides how to add anchor links for headings in Starlight project.
     .sl-markdown-content :is(h1, h2, h3, h4, h5, h6) {
       a {
         text-decoration: none;
-        font-size: 1.2rem;
-        margin-left: 0.5rem;
+        color: var(--sl-color-white);
+        line-height: var(--sl-line-height-headings);
+        font-weight: 600;
         color: transparent !important;
       }
 
@@ -59,4 +60,4 @@ This is guides how to add anchor links for headings in Starlight project.
       }
     }
     ```
-</Steps>
+</Steps>
diff --git a/src/styles/headings.css b/src/styles/headings.css
@@ -1,8 +1,9 @@
 .sl-markdown-content :is(h1, h2, h3, h4, h5, h6) {
   a {
     text-decoration: none;
-    font-size: 1.2rem;
-    margin-left: 0.5rem;
+    color: var(--sl-color-white);
+    line-height: var(--sl-line-height-headings);
+    font-weight: 600;
     color: transparent !important;
   }
 
@@ -13,4 +14,4 @@
   .icon.icon-link::after {
     content: '🔗';
   }
-}
+}