From f4e920bff4bdcd3e5168d50c2ccd140cddca4c8b Mon Sep 17 00:00:00 2001
From: Ryan Freeman <hello@ryanfreeman.dev>
Date: Sun, 30 Mar 2025 20:28:17 +0100
Subject: [PATCH] Fix heading component

---
 components/ui/Heading.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/components/ui/Heading.tsx b/components/ui/Heading.tsx
index c5141a6..e1bd419 100644
--- a/components/ui/Heading.tsx
+++ b/components/ui/Heading.tsx
@@ -10,7 +10,7 @@ type HeadingProps = {
 }
 
 export function Heading({as: Component = 'h1', children = null}: HeadingProps) {
-    const ref = useRef<HTMLAnchorElement>(null);
+    const ref = useRef<HTMLAnchorElement>(null)
     const headingText = children?.toString() || ''
 
     useEffect(() => {
@@ -20,9 +20,9 @@ export function Heading({as: Component = 'h1', children = null}: HeadingProps) {
     }, [])
 
     return (
-        <Component id={createSlug(headingText)} className="flex group">
+        <Component id={createSlug(headingText)} className="group">
             {children}
-            <Link className="sr-only group-hover:not-sr-only !ml-1.5" href={`#${createSlug(headingText)}`} ref={ref}></Link>
+            <Link className="ml-1.5 invisible group-hover:visible" href={`#${createSlug(headingText)}`} ref={ref}></Link>
         </Component>
     )
 }
\ No newline at end of file