Updates and more

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

@@ -2,14 +2,16 @@
 import { getCollection } from 'astro:content'
 import NavbarLayout from "../layouts/NavbarLayout.astro";
 import {astroI18n, createGetStaticPaths} from "astro-i18n";
+import localBau from "../images/2023-10-08_20.43.43.png";
+import {Image} from "astro:assets";
 
-export const getStaticPaths = async () => {
+export const getStaticPaths = createGetStaticPaths(async () => {
     let posts = await getCollection("pages");
 
     return posts.filter(value => value.id.split("/")[0] === astroI18n.locale).map((page) => ({
         props: { page }, params: { slug: page.slug }
     }) )
-}
+})
 
 const { page } = Astro.props;
 const { Content } = await page.render();
@@ -17,16 +19,19 @@ const { Content } = await page.render();
 
 
 <NavbarLayout title={page.data.title}>
-    <article>
-        <h1 class="text-left">{page.data.title}</h1>
-        <Content />
-    </article>
+    <div>
+        <Image src={localBau} alt="Bau" width="1920" height="1080" class="w-screen h-screen dark:brightness-75 fixed -z-10 object-cover" draggable="false" />
+        <article>
+            <h1 class="text-left">{page.data.title}</h1>
+            <Content />
+        </article>
+    </div>
 </NavbarLayout>
 
 <style is:global>
     article {
-        width: clamp(75%, 25rem, 100vw);
-        @apply mx-auto bg-gray-100 px-4 py-8 rounded-b-md shadow-md pt-40 sm:pt-28 md:pt-14
+        width: min(100vw, 75em);
+        @apply mx-auto bg-gray-100 p-8 rounded-b-md shadow-md pt-40 sm:pt-28 md:pt-14
             dark:text-white dark:bg-neutral-900;
 
         p {
@@ -65,6 +70,10 @@ const { Content } = await page.render();
             @apply list-disc;
         }
 
+        code {
+            @apply dark:text-neutral-400 text-neutral-800;
+        }
+
         pre.astro-code {
             @apply w-fit p-4 rounded-md border-2 border-gray-600 my-4;
         }