Fix accessibility issues

astro.config.mjs

@@ -1,11 +1,11 @@
 // https://astro.build/config
+import preact from '@astrojs/preact';
 import sitemap from '@astrojs/sitemap';
 import tailwind from '@astrojs/tailwind';
-import { defineConfig } from 'astro/config';
 import compress from 'astro-compress';
+import { defineConfig } from 'astro/config';
 import rehypeExternalLinks from 'rehype-external-links';
 import { serializeSitemap, shouldIndexPage } from './sitemap.mjs';
-import preact from '@astrojs/preact';
 
 // https://astro.build/config
 export default defineConfig({

src/components/FAQs/Answer.astro

@@ -1,3 +1,3 @@
-<div class='text-sm sm:text-base leading-relaxed text-left p-2 sm:p-4 text-md text-gray-800 border-t border-t-gray-300 bg-gray-100 rounded-bl-md rounded-br-md [&>p:not(:last-child)]:mb-3 [&>p>a]:underline [&>p>a]:text-blue-500'>
+<div class='text-sm sm:text-base leading-relaxed text-left p-2 sm:p-4 text-md text-gray-800 border-t border-t-gray-300 bg-gray-100 rounded-bl-md rounded-br-md [&>p:not(:last-child)]:mb-3 [&>p>a]:underline [&>p>a]:text-blue-700'>
   <slot />
 </div>

src/components/PageSponsor.tsx

@@ -53,9 +53,8 @@ export function PageSponsor(props: PageSponsorProps) {
     });
   };
 
-  // We load the sponsor after 1 second of the page load
   useEffect(() => {
-    loadSponsor();
+    window.setTimeout(loadSponsor, 500);
   }, []);
 
   if ($isSponsorHidden || !sponsor) {
@@ -81,8 +80,6 @@ export function PageSponsor(props: PageSponsorProps) {
       <span
         class="absolute right-1.5 top-1.5 text-gray-300 hover:text-gray-800"
         aria-label="Close"
-        aria-role="button"
-        close-sponsor
         onClick={(e) => {
           e.preventDefault();
           e.stopImmediatePropagation();

src/layouts/BaseLayout.astro

@@ -5,7 +5,7 @@ import Footer from '../components/Footer.astro';
 import Navigation from '../components/Navigation/Navigation.astro';
 import OpenSourceBanner from '../components/OpenSourceBanner.astro';
 import { PageProgress } from '../components/PageProgress';
-import { PageSponsor,PageSponsorType } from '../components/PageSponsor';
+import { PageSponsor } from '../components/PageSponsor';
 import { siteConfig } from '../lib/config';
 import '../styles/global.css';
 
@@ -147,7 +147,7 @@ const gaPageIdentifier = Astro.url.pathname
     <Analytics />
     <Authenticator />
     <PageProgress client:idle />
-    <PageSponsor gaPageIdentifier={briefTitle || gaPageIdentifier} client:idle />
+    <PageSponsor gaPageIdentifier={briefTitle || gaPageIdentifier} client:load />
 
     <slot name='after-footer' />
   </body>