From f9eacd66c55b05f45ea425d36b6cf4831b58d0f6 Mon Sep 17 00:00:00 2001
From: Antoine BERNIER <antoine.bernier@gmail.com>
Date: Sat, 14 Sep 2024 20:44:19 +0200
Subject: [PATCH] fix: semantic tags

---
 src/app/[...slug]/page.tsx         |  4 ++--
 src/components/mdx/Intro/Intro.tsx | 12 ++++++++++--
 2 files changed, 12 insertions(+), 4 deletions(-)

diff --git a/src/app/[...slug]/page.tsx b/src/app/[...slug]/page.tsx
index 78b0f8cd..9c620ce4 100644
--- a/src/app/[...slug]/page.tsx
+++ b/src/app/[...slug]/page.tsx
@@ -37,14 +37,14 @@ export default async function Page({ params }: Props) {
 
   return (
     <>
-      <div className={cn('mb-6 mt-8 border-b', 'border-outline-variant/50')}>
+      <header className={cn('mb-6 mt-8 border-b', 'border-outline-variant/50')}>
         <h1 className="mb-2 text-5xl font-bold tracking-tighter">{doc.title}</h1>
         {!!doc?.description?.length && (
           <p className={cn('my-2 text-base leading-5', 'text-on-surface-variant/50')}>
             {doc.description}
           </p>
         )}
-      </div>
+      </header>
       {doc ? <>{doc.content}</> : 'empty doc'}
     </>
   )
diff --git a/src/components/mdx/Intro/Intro.tsx b/src/components/mdx/Intro/Intro.tsx
index d4b9fe08..4c0dc334 100644
--- a/src/components/mdx/Intro/Intro.tsx
+++ b/src/components/mdx/Intro/Intro.tsx
@@ -1,6 +1,14 @@
 import cn from '@/lib/cn'
+import { VisuallyHidden } from '@radix-ui/react-visually-hidden'
 import { ComponentProps } from 'react'
 
-export function Intro({ className, ...props }: ComponentProps<'div'>) {
-  return <div {...props} className={cn(className, 'my-6 text-xl leading-relaxed')} />
+export function Intro({ children, className, ...props }: ComponentProps<'div'>) {
+  return (
+    <section {...props} className={cn(className, 'my-6 text-xl leading-relaxed')}>
+      <VisuallyHidden>
+        <h2>Summary</h2>
+      </VisuallyHidden>
+      {children}
+    </section>
+  )
 }