initial commit

src/pages/rules.astro

@@ -0,0 +1,39 @@
+---
+import WebsiteLayout from '@layouts/website/WebsiteLayout.astro';
+import { rulesLong } from '../rules';
+---
+
+<WebsiteLayout title="Regeln">
+  <div class="mx-4 my-6 sm:mx-48 sm:my-12">
+    <h1 class="text-3xl lg:text-5xl mb-4">Varo 5 Regelwerk</h1>
+    <div class="collapse collapse-arrow">
+      <input type="checkbox" autocomplete="off" checked />
+      <div class="collapse-title">
+        <p>0. Vorwort</p>
+      </div>
+      <div class="collapse-content">
+        <p>{rulesLong.header}</p>
+        <p class="mt-1 text-[.75rem]">{rulesLong.footer}</p>
+      </div>
+      <span class="block w-full h-[1px] mx-auto mb-1 bg-gray-600"></span>
+    </div>
+    {
+      rulesLong.sections.map((section, i) => (
+        <div>
+          <div class="collapse collapse-arrow">
+            <input type="checkbox" autocomplete="off" />
+            <div class="collapse-title">
+              <p>
+                {i + 1}. {section.title}
+              </p>
+            </div>
+            <div class="collapse-content">
+              <p>{section.content}</p>
+            </div>
+          </div>
+          <span class="block w-full h-[1px] mx-auto mb-1 bg-gray-600" />
+        </div>
+      ))
+    }
+  </div>
+</WebsiteLayout>