From fa21aad65a0f00d7da270ad46773f327b99ac25d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?S=C3=A9rgio=20Rafael=20Siqueira?=
 <osergiosiqueira@gmail.com>
Date: Wed, 30 Apr 2025 19:50:12 -0300
Subject: [PATCH] using native html

---
 superpage/src/components/Accordion/Body.astro   | 6 ++----
 superpage/src/components/Accordion/Header.astro | 8 +++-----
 superpage/src/components/Accordion/Item.astro   | 8 +++-----
 superpage/src/pages/[slug].astro                | 2 +-
 4 files changed, 9 insertions(+), 15 deletions(-)

diff --git a/superpage/src/components/Accordion/Body.astro b/superpage/src/components/Accordion/Body.astro
index 85173a6..38089aa 100644
--- a/superpage/src/components/Accordion/Body.astro
+++ b/superpage/src/components/Accordion/Body.astro
@@ -1,7 +1,5 @@
-<div
-    x-show="open"
+<main
     class="text-sm/6 text-white/70 space-y-2.5 px-5 pb-3 [&_ul]:list-disc [&_ul]:list-inside"
-    style="display: none;"
 >
     <slot />
-</div>
+</main>
diff --git a/superpage/src/components/Accordion/Header.astro b/superpage/src/components/Accordion/Header.astro
index 312f842..4f99045 100644
--- a/superpage/src/components/Accordion/Header.astro
+++ b/superpage/src/components/Accordion/Header.astro
@@ -2,14 +2,12 @@
 import { Icon } from "astro-icon/components";
 ---
 
-<div
+<summary
     class="cursor-pointer flex items-center justify-between px-5 gap-3 py-3"
-    x-on:click="open = ! open"
 >
     <slot />
     <Icon
         name="chevron-down"
-        class="size-4 fill-white/60 group-data-[hover]:fill-white/50 shrink-0 transition duration-300"
-        :class="{'-rotate-180': open === true}"
+        class="size-4 fill-white/60 group-data-[hover]:fill-white/50 shrink-0 transition duration-300 group-open:-rotate-180"
     />
-</div>
+</summary>
diff --git a/superpage/src/components/Accordion/Item.astro b/superpage/src/components/Accordion/Item.astro
index 62f82b2..87cba7d 100644
--- a/superpage/src/components/Accordion/Item.astro
+++ b/superpage/src/components/Accordion/Item.astro
@@ -1,7 +1,5 @@
-<div
-    x-data="{ open: false }"
-    class="bg-white/10 w-full hover:bg-white/15 aria-expanded:bg-white/15 rounded-lg transition"
-    x-bind:aria-expanded="open"
+<details
+    class="bg-white/10 w-full hover:bg-white/15 aria-expanded:bg-white/15 rounded-lg transition group"
 >
     <slot />
-</div>
+</details>
diff --git a/superpage/src/pages/[slug].astro b/superpage/src/pages/[slug].astro
index 99621da..a460aac 100644
--- a/superpage/src/pages/[slug].astro
+++ b/superpage/src/pages/[slug].astro
@@ -169,6 +169,6 @@ const { Content } = await render(course);
         </Container>
         {/* Course End */}
 
-        <Content test=": tes" />
+        <Content />
     </section>
 </Layout>