faq collapsible details

1 files changed, 74 insertions, 79 deletions

diff --git a/dacctal/faq/index.html b/dacctal/faq/index.html
index 2285863..50bc31a 100644
--- a/dacctal/faq/index.html
+++ b/dacctal/faq/index.html
@@ -12,87 +12,82 @@
     <p>once you go dacctal, you never go bacctal. c ‿c</p>
     <br>
 
-    <h2>What I use</h2>
-
-    <section class="block">
-      <h3>Q: Distro?</h3>
-      <h3>A: <a href="https://www.gentoo.org/">Gentoo</a></h3>
-    </section>
-    <br>
-
-    <section class="block">
-      <h3>Q: Window Manager?</h3>
-      <h3>A: <a href="https://github.com/tonybanters/oxwm">OXWM</a></h3>
-    </section>
-    <br>
-
-    <section class="block">
-      <h3>Q: Display Manager?</h3>
-      <h3>A: TTY</h3>
-    </section>
-    <br>
-
-    <section class="block">
-      <h3>Q: Bar?</h3>
-      <h3>A: <a href="https://github.com/tonybanters/oxwm">OXWM</a>'s built-in bar</h3>
-    </section>
-    <br>
-
-    <section class="block">
-      <h3>Q: Browser?</h3>
-      <h3>A: <a href="https://codeberg.org/librewolf/source">Librewolf</a></h3>
-    </section>
+    <details class="subtitle">
+      <summary>What I use</summary>
+      <div class="entries">
+        <section class="block">
+          <h3>Q: Distro?</h3>
+          <h3>A: <a href="https://www.gentoo.org/">Gentoo</a></h3>
+        </section>
+
+        <section class="block">
+          <h3>Q: Window Manager?</h3>
+          <h3>A: <a href="https://github.com/tonybanters/oxwm">OXWM</a></h3>
+        </section>
+
+        <section class="block">
+          <h3>Q: Display Manager?</h3>
+          <h3>A: TTY</h3>
+        </section>
+
+        <section class="block">
+          <h3>Q: Bar?</h3>
+          <h3>A: <a href="https://github.com/tonybanters/oxwm">OXWM</a>'s built-in bar</h3>
+        </section>
+
+        <section class="block">
+          <h3>Q: Browser?</h3>
+          <h3>A: <a href="https://codeberg.org/librewolf/source">Librewolf</a></h3>
+        </section>
+
+        <section class="block">
+          <h3>Q: Browser tabs extension?</h3>
+          <h3>A: <a href="https://github.com/mbnuqw/sidebery">Sidebery</a></h3>
+        </section>
+
+        <section class="block">
+          <h3>Q: Colorscheme?</h3>
+          <h3>A: <a href="https://git.symlinx.net/daccfiles/tree/.config">Caelus</a></h3>
+        </section>
+
+        <section class="block">
+          <h3>Q: Text Editor?</h3>
+          <h3>A: <a href="https://sr.ht/~martanne/vis/">Vis</a></h3>
+        </section>
+
+        <section class="block">
+          <h3>Q: Terminal?</h3>
+          <h3>A: <a href="https://st.suckless.org/">st</a> [ no patches ]</h3>
+        </section>
+
+        <section class="block">
+          <h3>Q: Animated pfp?</h3>
+          <h3>A: <a href="https://git.bwaaa.monster/PNDacc">PNDacc</a></h3>
+        </section>
+
+        <section class="block">
+          <h3>Q: Font?</h3>
+          <h3>A: Two fonts:</h3>
+          <h4>Applications:</h4>
+          <p><a href="https://github.com/be5invis/Iosevka">Iosevka</a> : <a href="https://git.symlinx.net/daccfiles/tree/iosevka/private-build-plans.toml">caelusevka</a></p>
+          
+          <h4>A: Videos/Bar:</h4>
+          <p><a href="https://www.nerdfonts.com/font-downloads">BigBlueTermPlus</a></p>
+          
+        </section>
+      </div>
+    </details>
     <br>
 
-    <section class="block">
-      <h3>Q: Browser tabs extension?</h3>
-      <h3>A: <a href="https://github.com/mbnuqw/sidebery">Sidebery</a></h3>
-    </section>
-    <br>
-
-    <section class="block">
-      <h3>Q: Colorscheme?</h3>
-      <h3>A: <a href="https://git.symlinx.net/daccfiles/tree/.config">Caelus</a></h3>
-    </section>
-    <br>
-
-    <section class="block">
-      <h3>Q: Text Editor?</h3>
-      <h3>A: <a href="https://sr.ht/~martanne/vis/">Vis</a></h3>
-    </section>
-    <br>
-
-    <section class="block">
-      <h3>Q: Terminal?</h3>
-      <h3>A: <a href="https://st.suckless.org/">st</a> [ no patches ]</h3>
-    </section>
-    <br>
-
-    <section class="block">
-      <h3>Q: Animated pfp?</h3>
-      <h3>A: <a href="https://git.bwaaa.monster/PNDacc">PNDacc</a></h3>
-    </section>
-    <br>
-
-    <section class="block">
-      <h3>Q: Font?</h3>
-      <h3>A: Two fonts:</h3>
-      <h4>Applications:</h4>
-      <p><a href="https://github.com/be5invis/Iosevka">Iosevka</a> : <a href="https://git.symlinx.net/daccfiles/tree/iosevka/private-build-plans.toml">caelusevka</a></p>
-      
-      <h4>A: Videos/Bar:</h4>
-      <p><a href="https://www.nerdfonts.com/font-downloads">BigBlueTermPlus</a></p>
-      
-    </section>
-    <br>
-
-    <h2>Misc</h2>
-
-    <section class="block">
-      <h3>Q: Cat?</h3>
-      <h3>A: Her name is Netcat and you cannot change that!!</h3>
-    </section>
-    <br>
+    <details class="subtitle">
+      <summary>Misc</summary>
+      <div class="entries">
+        <section class="block">
+          <h3>Q: Cat?</h3>
+          <h3>A: Her name is Netcat and you cannot change that!!</h3>
+        </section>
+      </div>
+    </details>
 
   </body>
 </html>