Migrate Site to German as Default Locale

src/pages/regeln/index.astro

@@ -0,0 +1,43 @@
+---
+import wg from "../../images/WarGears.png";
+import mwg from "../../images/MiniWarGears.png";
+import as from "../../images/AirShips.png";
+import ws from "../../images/WarShips.png";
+import {t} from "astro-i18n";
+import {getCollection} from "astro:content";
+import PageLayout from "../../layouts/PageLayout.astro";
+import {Image} from "astro:assets";
+import {l} from "../../util/util";
+
+const imageMap = {
+    "wg": wg,
+    "mwg": mwg,
+    "as": as,
+    "ws": ws,
+    "qg": mwg,
+};
+
+const modes = await getCollection("modes", entry => entry.data.main);
+---
+
+<PageLayout title={t("rules.page")}>
+    {modes.map(value => (
+        <div class="dark:bg-neutral-800 rounded-md p-4 border border-neutral-400 shadow-md my-4 flex flex-col
+                 md:flex-row">
+            <Image height="300" width="300" src={imageMap[value.data.translationKey]}
+                alt={t("rules." + value.data.translationKey + ".title")} class="dark:invert"></Image>
+            <div class="ml-4">
+                <h1 class="text-2xl font-bold">{t(value.data.translationKey + ".title")}</h1>
+                <div>{t("rules." + value.data.translationKey + ".description")}</div>
+                <div class="mt-2 flex flex-col">
+                    <a href={l(`/rules/${value.id}`)} class="text-yellow-300 hover:underline w-fit">{t("rules.rules")}</a>
+                    <a href={l(`/announcements/tags/${value.id}`)}
+                        class="text-yellow-300 hover:underline w-fit">{t("rules.announcements")}</a>
+                    {value.data.ranked
+                        ? <a href={l(`/ranked/${value.id}`)}
+                            class="text-yellow-300 hover:underline w-fit">{t("rules.ranking")}</a>
+                        : null}
+                </div>
+            </div>
+        </div>))}
+</PageLayout>