Some™️Pages

src/pages/announcements/[...slug].astro

@@ -30,15 +30,13 @@ const { Content } = await post.render();
 <PageLayout title={post.data.title}>
     <article>
         <h1 class="text-4xl mb-0">{post.data.title}</h1>
-        <h3 class="flex items-center mt-0 text-neutral-300"><TagSolid class="w-4 h-4 mr-2" /> {post.data.tags.map(tag => (
-                <a href={l(`/announcements/tags/${tag}`)}>
-                    <span class="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2 shadow-2xl">{capitalize(tag)}</span>
-                </a>
+        <h5 class="flex items-center mt-0 text-neutral-300"><TagSolid class="w-4 h-4 mr-2" /> {post.data.tags.map(tag => (
+                <TagComponent tag={tag} />
         ))} <CalendarMonthSolid class="w-4 h-4 mr-2" /> {Intl.DateTimeFormat(astroI18n.locale, {
             day: 'numeric',
             month: 'short',
             year: 'numeric'
-        }).format(post.data.created)} </h3>
+        }).format(post.data.created)} </h5>
         <Content />
         <script>
             import type {ExtendedEvent} from "../../components/types/event";

src/pages/rules/[mode].astro

@@ -7,7 +7,7 @@ export const getStaticPaths = createGetStaticPaths(async () => {
     let posts = await getCollection("rules", value => value.id.split("/")[0] === astroI18n.locale);
 
     return posts.map((page) => ({
-        props: { page }, params: { slug: page.slug.split("/")[1] }
+        props: { page }, params: { mode: page.slug.split("/")[1] }
     }))
 })
 
@@ -20,8 +20,14 @@ const { Content } = await page.render();
 ---
 
 
-<PageLayout title={t("title", {mode: t(`${page.data.translationKey}.title`)})}>
+<PageLayout title={t("title", {mode: t(`${page.data.translationKey}.title`, {}, {route: "/rules"})}, {route: "/rules"})}>
     <article>
+        {page.data.german && (
+            <div class="bg-yellow-100 border-l-4 border-yellow-500 text-yellow-700 p-4" role="alert">
+                <div class="font-bold">{t("warning.title", {}, {route: "/rules"})}</div>
+                <div>{t("warning.text", {}, {route: "/rules"})}</div>
+            </div>
+        )}
         <Content />
     </article>
 </PageLayout>