Update main element with id 'main-content'

src/layouts/AboutLayout.astro

@@ -15,7 +15,7 @@ const { frontmatter } = Astro.props;
 
 <Layout title={frontmatter.title}>
   <Header activeNav="about" />
-  <main>
+  <main id="main-content">
     <section class="mt-8 mb-28 prose prose-slate max-w-3xl">
       <h1 class="text-2xl sm:text-3xl tracking-wider">{frontmatter.title}</h1>
       <slot />

src/layouts/Main.astro

@@ -7,7 +7,7 @@ export interface Props {
 const { pageTitle, pageDesc } = Astro.props;
 ---
 
-<main>
+<main id="main-content">
   <h1>{pageTitle}</h1>
   <p>{pageDesc}</p>
   <slot />

src/pages/index.astro

@@ -15,7 +15,7 @@ const sortedPosts = getSortedPosts(posts);
 
 <Layout title="Welcome to Astro.">
   <Header />
-  <main>
+  <main id="main-content">
     <section id="hero">
       <h1>Mingalaba<span>.</span></h1>
       <p>

src/pages/posts/[slug].astro

@@ -32,7 +32,7 @@ const { Content, frontmatter } = Astro.props.post;
 
 <Layout title={frontmatter.title}>
   <Header />
-  <main>
+  <main id="main-content">
     <h1 class="post-title">{frontmatter.title}</h1>
     <Datetime datetime={frontmatter.datetime} size="lg" className="my-2" />
     <article