feat: add madeira blog post upgrade astro

astro.config.mjs

@@ -10,7 +10,7 @@ import UnoCSS from 'unocss/astro'
 
 const defaultLocale = "de";
 const locales = {
-  en: "en", // the `defaultLocale` value must present in `locales` keys
+  en: "en",
   de: "de",
 };
 
@@ -43,16 +43,16 @@ export default defineConfig({
     remarkPlugins: [setDefaultLayout]
   },
   integrations: [
-    mdx(),
-    svelte(),
-    UnoCSS({
-      injectReset: true
-    }),
     i18n({
       exclude: ["pages/**/*.json.ts", "pages/api/**/*",],
       locales,
       defaultLocale,
     }),
+    mdx(),
+    svelte(),
+    UnoCSS({
+      injectReset: true
+    }),
     sitemap({
       i18n: {
         locales,

package.json

@@ -10,33 +10,33 @@
     "astro": "astro"
   },
   "dependencies": {
-    "@astrojs/check": "^0.7.0",
-    "@astrojs/mdx": "^3.1.1",
-    "@astrojs/svelte": "^5.6.0",
-    "@astrojs/tailwind": "^5.1.0",
-    "astro": "^4.11.0",
-    "astro-i18n-aut": "^0.7.0",
-    "exifreader": "^4.23.3",
-    "svelte": "^4.2.18",
-    "svelte-gestures": "^5.0.1",
-    "tailwindcss": "^3.4.4",
+    "@astrojs/check": "^0.9.4",
+    "@astrojs/mdx": "^4.0.8",
+    "@astrojs/svelte": "^7.0.4",
+    "@astrojs/tailwind": "^6.0.0",
+    "astro": "^5.3.0",
+    "astro-i18n-aut": "^0.7.3",
+    "exifreader": "^4.26.1",
+    "svelte": "^5.20.1",
+    "svelte-gestures": "^5.1.3",
+    "tailwindcss": "^4.0.6",
     "thumbhash": "^0.1.1",
-    "typescript": "^5.5.2"
+    "typescript": "^5.7.3"
   },
   "devDependencies": {
-    "@astrojs/sitemap": "^3.1.6",
-    "@iconify-json/tabler": "^1.1.114",
-    "@types/markdown-it": "^14.1.1",
-    "@unocss/preset-icons": "^0.61.0",
-    "@unocss/reset": "^0.61.0",
-    "astro-font": "^0.0.81",
+    "@astrojs/sitemap": "^3.2.1",
+    "@iconify-json/tabler": "^1.2.16",
+    "@types/markdown-it": "^14.1.2",
+    "@unocss/preset-icons": "^65.5.0",
+    "@unocss/reset": "^65.5.0",
+    "astro-font": "^1.0.0",
     "markdown-it": "^14.1.0",
-    "ogl": "^1.0.7",
-    "prettier": "^3.3.2",
-    "prettier-plugin-astro": "^0.14.0",
-    "sharp": "^0.33.4",
-    "unocss": "^0.61.0",
-    "unplugin-icons": "^0.19.0",
-    "vite-plugin-glsl": "^1.3.0"
+    "ogl": "^1.0.11",
+    "prettier": "^3.5.1",
+    "prettier-plugin-astro": "^0.14.1",
+    "sharp": "^0.33.5",
+    "unocss": "^65.5.0",
+    "unplugin-icons": "^22.0.0",
+    "vite-plugin-glsl": "^1.3.1"
   }
 }

src/components/HeroCard.astro

@@ -3,18 +3,14 @@ import markdownToText from "@helpers/markdownToText";
 import { Card } from "./card";
 import { useTranslatedPath, useTranslations } from "@i18n/utils";
 import Image from "@components/Image.astro";
-import type { ImageMetadata } from "astro";
+import type { InferEntrySchema } from "astro:content";
 
 interface Props {
   post: {
-    data: {
-      title: string;
-      icon?: string;
-      cover?: ImageMetadata;
-    };
+    data: InferEntrySchema<"projects">;
     collection: string;
-    slug: string;
-    body: string;
+    id: string;
+    body?: string;
   };
 }
 
@@ -22,13 +18,13 @@ const {
   data: { title, cover, icon },
   collection,
   body,
-  slug,
+  id,
 } = Astro.props.post;
 
 const translatePath = useTranslatedPath(Astro.url);
 const t = useTranslations(Astro.url);
 
-const link = translatePath(`/${collection}/${slug.split("/")[0]}`);
+const link = translatePath(`/${collection}/${id.split("/")[0]}`);
 ---
 
 <Card
@@ -39,7 +35,7 @@ const link = translatePath(`/${collection}/${slug.split("/")[0]}`);
       {title}
     </Card.Title>
     <Card.Description>
-      {markdownToText(body).slice(0, 200)}
+      {markdownToText(body ?? "").slice(0, 200)}
     </Card.Description>
     <Card.ReadMoreButton link={link} text={t("read-more")} />
   </Card.Content>

src/components/ImageGallery.svelte

@@ -141,6 +141,15 @@
     // console.log(ev);
   };
 
+  function formatExposureTime(num: string) {
+    if (num.includes("/")) {
+      const [a, b] = num.split("/");
+      return `${a}/${b}s`;
+    } else {
+      return num + "s";
+    }
+  }
+
   onMount(() => {
     const wrappers = Array.prototype.slice.call(
       document.querySelectorAll("picture > img"),
@@ -168,7 +177,9 @@
               ? exifData.FocalLength.replace(" mm", "mm")
               : "",
             "FNumber" in exifData ? exifData.FNumber : "",
-            "ExposureTime" in exifData ? exifData.ExposureTime : "",
+            "ExposureTime" in exifData
+              ? formatExposureTime(exifData.ExposureTime)
+              : "",
           ];
         }
       } catch (error) {
@@ -206,10 +217,11 @@
     <div class="controls">
       {#each images as _, i}
         <button
+          aria-label={`Image ${i + 1}`}
           class:active={currentIndex === i}
           on:click={() => {
             currentIndex = i;
-          }} />
+          }}></button>
       {/each}
     </div>
   {/if}

src/components/SmallCard.astro

@@ -1,20 +1,16 @@
 ---
 import markdownToText from "@helpers/markdownToText";
 import { useTranslatedPath } from "@i18n/utils";
+import type { InferEntrySchema } from "astro:content";
 
 const tp = useTranslatedPath(Astro.url);
 
 interface Props {
   post: {
-    data: {
-      title: string;
-      description?: string;
-      icon?: string;
-      tags?: string[];
-    };
+    data: InferEntrySchema<"blog">;
     collection: string;
-    body: string;
-    slug: string;
+    body?: string;
+    id: string;
   };
 }
 
@@ -22,15 +18,14 @@ const { post } = Astro.props;
 ---
 
 <div class="rounded-diag-md border border-neutral p-4 overflow-hidden">
-  <a href={tp(`/${post.collection}/${post.slug.split("/")[0]}`)}>
+  <a href={tp(`/${post.collection}/${post.id.split("/")[0]}`)}>
     <h2
-      class="text-2xl flex gap-2 items-center line-clamp text-ellipsis overflow-hidden"
-    >
+      class="text-2xl flex gap-2 items-center line-clamp text-ellipsis overflow-hidden">
       {post.data.icon && <img src={post.data.icon} class="h-6" />}
       {post.data.title}
     </h2>
     <p class="text-ellipsis overflow-hidden line-clamp-2">
-      {post.data.description || markdownToText(post.body).slice(0, 200)}
+      {post.data.description || markdownToText(post?.body || "").slice(0, 200)}
     </p>
   </a>
   {
@@ -39,8 +34,7 @@ const { post } = Astro.props;
         {post.data.tags.map((tag) => (
           <a
             href={tp(`/tag/${tag}`)}
-            class="text-xs border border-neutral p-2 rounded-md"
-          >
+            class="text-xs border border-neutral p-2 rounded-md">
             {tag}
           </a>
         ))}

src/components/card/ReadMoreButton.svelte

@@ -7,5 +7,5 @@
   href={link}
   data-astro-prefetch
   class="bg-light p-2 text-s rounded-md px-4 flex flex-0 items-center gap-2 w-fit"
-  >{text}<span class="i-tabler-arrow-right inline-block w-4 h-4" />
+  >{text}<span class="i-tabler-arrow-right inline-block w-4 h-4"></span>
 </a>

src/components/card/index.ts

@@ -5,14 +5,7 @@ import Title from './Title.svelte';
 import Description from './Description.svelte';
 import ReadMoreButton from './ReadMoreButton.svelte';
 
-const Card = {
-  ...Wrapper,
-  Image,
-  Content,
-  Title,
-  Description,
-  ReadMoreButton
-} as typeof Wrapper & {
+const Card = Wrapper as typeof Wrapper & {
   Image: typeof Image;
   Content: typeof Content;
   Title: typeof Title;
@@ -20,4 +13,10 @@ const Card = {
   ReadMoreButton: typeof ReadMoreButton;
 }
 
+Card.Image = Image;
+Card.Content = Content;
+Card.Title = Title;
+Card.Description = Description;
+Card.ReadMoreButton = ReadMoreButton;
+
 export { Card };

src/content.config.ts

@@ -0,0 +1,33 @@
+import { glob } from 'astro/loaders';
+import { defineCollection, z, type ImageFunction } from 'astro:content';
+
+const defaultSchema = ({ image }: { image: ImageFunction }) => z.object({
+  title: z.string(),
+  date: z.date(),
+  cover: image().optional(),
+  links: z.array(z.array(z.string())).optional(),
+  coverAlt: z.string().optional(),
+  toc: z.boolean().optional(),
+  description: z.string().optional(),
+  icon: z.string().optional(),
+  draft: z.boolean().optional(),
+  featured: z.boolean().optional(),
+  tags: z.array(z.string()).optional(),
+  _layout: z.enum(['normal', 'transparent']).optional(),
+})
+
+
+export const collections = {
+  'blog': defineCollection({
+    loader: glob({ pattern: '**/[^_]*.{md,mdx}', base: "./src/content/blog" }),
+    schema: defaultSchema,
+  }),
+  "projects": defineCollection({
+    loader: glob({ pattern: '**/[^_]*.{md,mdx}', base: "./src/content/projects" }),
+    schema: defaultSchema,
+  }),
+  "photos": defineCollection({
+    loader: glob({ pattern: '**/[^_]*.{md,mdx}', base: "./src/content/photos" }),
+    schema: defaultSchema,
+  })
+};

src/content/config.ts

@@ -1,26 +0,0 @@
-import { defineCollection, z } from 'astro:content';
-
-const blogCollection = defineCollection({
-  schema: ({ image }) => z.object({
-    title: z.string(),
-    date: z.date(),
-    cover: image().refine((img) => img.width >= 720, {
-      message: "Cover image must be at least 720 pixels wide!",
-    }).optional(),
-    links: z.array(z.array(z.string())).optional(),
-    coverAlt: z.string().optional(),
-    toc: z.boolean().optional(),
-    description: z.string().optional(),
-    icon: z.string().optional(),
-    draft: z.boolean().optional(),
-    featured: z.boolean().optional(),
-    tags: z.array(z.string()).optional(),
-    _layout: z.enum(['normal', 'transparent']).optional(),
-  })
-});
-
-export const collections = {
-  'blog': blogCollection,
-  "projects": blogCollection,
-  "photos": blogCollection,
-};

src/content/photos/madeira-2025/index.en.mdx

@@ -0,0 +1,102 @@
+---
+title: Madeira
+date: 2025-02-16
+license: "CC-BY-SA:4.0"
+comments: true
+cover: ./images/MAX_0603.jpg
+---
+
+import Image from "@components/Image.astro";
+import Picture from "@components/Picture.astro";
+import ImageGallery from "@components/ImageGallery.svelte"
+import ImageSlider from "@components/ImageSlider.svelte"
+
+import MAX_0354 from "./images/MAX_0354.jpg"
+import MAX_0369 from "./images/MAX_0369.jpg"
+import MAX_0442 from "./images/MAX_0442.jpg"
+import MAX_0447_Panorama from "./images/MAX_0447-Panorama.jpg"
+import MAX_0463 from "./images/MAX_0463.jpg"
+import MAX_0505 from "./images/MAX_0505.jpg"
+import MAX_0603 from "./images/MAX_0603.jpg"
+import MAX_0646 from "./images/MAX_0646.jpg"
+
+import PXL_20250209_132548610 from "./images/PXL_20250209_132548610.MP.jpg"
+import PXL_20250209_133848550 from "./images/PXL_20250209_133848550.MP.jpg"
+import PXL_20250210_150929413 from "./images/PXL_20250210_150929413.jpg"
+import PXL_20250211_174301568 from "./images/PXL_20250211_174301568.webm"
+import PXL_20250211_181321910 from "./images/PXL_20250211_181321910.jpg"
+import PXL_20250212_181932180 from "./images/PXL_20250212_181932180.RAW-02.ORIGINAL.jpg"
+
+
+import plant1 from "./images/plants/2025-02-09T11_05_08+00_00.JPEG"
+import plant2 from "./images/plants/2025-02-09T12_48_48+00_00.JPEG"
+import plant3 from "./images/plants/2025-02-09T12_55_24+00_00.JPEG"
+import PXL_20250209_125919043 from "./images/plants/PXL_20250209_125919043.jpg"
+import PXL_20250209_134733435 from "./images/plants/PXL_20250209_134733435.jpg"
+import PXL_20250209_173041299 from "./images/plants/PXL_20250209_173041299.jpg"
+import PXL_20250209_174719071 from "./images/plants/PXL_20250209_174719071.jpg"
+import PXL_20250209_175134355 from "./images/plants/PXL_20250209_175134355.jpg"
+import PXL_20250211_151038493 from "./images/plants/PXL_20250211_151038493.jpg"
+import PXL_20250212_142126974 from "./images/plants/PXL_20250212_142126974.jpg"
+import PXL_20250212_142920774 from "./images/plants/PXL_20250212_142920774.jpg"
+import PXL_20250212_144259621 from "./images/plants/PXL_20250212_144259621.jpg"
+import PXL_20250212_153335886 from "./images/plants/PXL_20250212_153335886.jpg"
+import PXL_20250212_154036484 from "./images/plants/PXL_20250212_154036484.jpg"
+import PXL_20250212_161706087 from "./images/plants/PXL_20250212_161706087.jpg"
+import PXL_20250212_163000971 from "./images/plants/PXL_20250212_163000971.jpg"
+
+<ImageGallery client:load/>
+
+Photos from my trip to Madeira in February 2025.
+
+## Porto Moniz
+
+<Picture caption="The evening coast of Madeira near Porto Moniz" src={MAX_0603} alt="Evening coastal scene, waves crashing over rocks in front of a restaurant"/>
+<Picture caption="Waves in Porto Moniz" src={MAX_0505} alt="Wave crashes over rocks, spray flies high into the air, resembling a horse"/>
+<Picture caption="More pictures of the waves at Porto Moniz" src={MAX_0442} alt="A wave frozen in time breaks over rocks"/>
+<Picture caption="Panorama from Porto Moniz towards Seixal" src={MAX_0447_Panorama} alt="Panoramic view of Madeira’s coastline, large rocks in the water, blue mountains in the distance"/>
+<Picture caption="People fishing in Porto Moniz" src={MAX_0463} alt="Three people standing in the harbor fishing in front of a red car"/>
+
+## Levada Nova Hike
+
+<Picture caption="Maidenhair fern, Adiantum Capillus-veneris, is one of my favorite plants, it is very widespread" src={MAX_0354} alt="Close-up of a green maidenhair fern"/>
+<Image src={PXL_20250209_132548610} alt="Standing on a metal platform in the mountains"/>
+<Image src={PXL_20250209_133848550} alt="Standing in front of a waterfall"/>
+
+## Seixal
+
+<Picture src={PXL_20250210_150929413} caption="Beautiful room with an ocean view in the post office of Seixal" alt=""/>
+<Picture caption="Misty mountain peaks over Seixal" src={MAX_0369} alt="Foggy, densely forested mountain peaks rising high above each other"/>
+
+## Hike around the Pico Areeiro
+
+<video src={PXL_20250211_174301568} controls alt="POV of a person walking over a rocky bridge in the fog"/>
+<Image src={PXL_20250211_181321910} alt="Curvy road between red, earthy hills"/>
+
+## Hike around Porto da Cruz
+
+<Image src={PXL_20250212_181932180} alt="Sitting in a giant fern"/>
+
+## Whale watching
+
+<Picture caption="A young humpback whale practicing jumps for mating season off the coast of Calheta" src={MAX_0646} alt="Humpback whale breaching out of the water"/>
+
+While traveling, I enjoy photographing plants that catch my eye. Here are some pictures of interesting plants I saw on Madeira. To identify them, I used the app [PlantNet](https://identify.plantnet.org/en).
+
+<ImageSlider title="Interesting plants of the island" client:load>
+  <Image src={plant1} alt="Dracaena reflexa (Song of India)"/>
+  <Image src={plant2} alt="Oxalis pes-caprae (Bermuda buttercup)"/>
+  <Image src={PXL_20250212_144259621} alt="Oxalis purpurea (Purple woodsorrel)"/>
+  <Image src={PXL_20250212_154036484} alt="Bituminaria bituminosa (Pitch trefoil)"/>
+  <Image src={PXL_20250209_125919043} alt="Galactites tomentosus (Purple milk thistle)"/>
+  <Image src={PXL_20250209_134733435} alt="Sonchus fruticosus (Tree dandelion)"/>
+  <Image src={PXL_20250209_174719071} alt="Persicaria capitata (Pink knotweed)"/>
+  <Image src={PXL_20250209_175134355} alt="Rhaphiolepis bibas (Loquat)"/>
+  <Image src={PXL_20250211_151038493} alt="Psidium cattleyanum (Strawberry guava)"/>
+  <Image src={PXL_20250212_142920774} alt="Tecoma stans (Yellow trumpetbush)"/>
+  <Image src={PXL_20250212_153335886} alt="Roldana petasitis (Velvet groundsel)"/>
+  <Image src={PXL_20250212_161706087} alt="Bidens pilosa (Spanish needle)"/>
+  <Image src={PXL_20250212_163000971} alt="Crassula multicava (Fairy crassula)"/>
+  <Image src={PXL_20250209_173041299} alt="Some kind of liverwort, possibly Targionia lorbeeriana"/>
+  <Image src={plant3} alt="Aeonium canariense (Canary Island aeonium)"/>
+</ImageSlider>

src/content/photos/madeira-2025/index.mdx

@@ -0,0 +1,102 @@
+---
+title: Madeira
+date: 2025-02-16
+license: "CC-BY-SA:4.0"
+comments: true
+cover: ./images/MAX_0603.jpg
+---
+
+import Image from "@components/Image.astro";
+import Picture from "@components/Picture.astro";
+import ImageGallery from "@components/ImageGallery.svelte"
+import ImageSlider from "@components/ImageSlider.svelte"
+
+import MAX_0354 from "./images/MAX_0354.jpg"
+import MAX_0369 from "./images/MAX_0369.jpg"
+import MAX_0442 from "./images/MAX_0442.jpg"
+import MAX_0447_Panorama from "./images/MAX_0447-Panorama.jpg"
+import MAX_0463 from "./images/MAX_0463.jpg"
+import MAX_0505 from "./images/MAX_0505.jpg"
+import MAX_0603 from "./images/MAX_0603.jpg"
+import MAX_0646 from "./images/MAX_0646.jpg"
+
+import PXL_20250209_132548610 from "./images/PXL_20250209_132548610.MP.jpg"
+import PXL_20250209_133848550 from "./images/PXL_20250209_133848550.MP.jpg"
+import PXL_20250210_150929413 from "./images/PXL_20250210_150929413.jpg"
+import PXL_20250211_174301568 from "./images/PXL_20250211_174301568.webm"
+import PXL_20250211_181321910 from "./images/PXL_20250211_181321910.jpg"
+import PXL_20250212_181932180 from "./images/PXL_20250212_181932180.RAW-02.ORIGINAL.jpg"
+
+import plant1 from "./images/plants/2025-02-09T11_05_08+00_00.JPEG"
+import plant2 from "./images/plants/2025-02-09T12_48_48+00_00.JPEG"
+import plant3 from "./images/plants/2025-02-09T12_55_24+00_00.JPEG"
+import PXL_20250209_125919043 from "./images/plants/PXL_20250209_125919043.jpg"
+import PXL_20250209_134733435 from "./images/plants/PXL_20250209_134733435.jpg"
+import PXL_20250209_173041299 from "./images/plants/PXL_20250209_173041299.jpg"
+import PXL_20250209_174719071 from "./images/plants/PXL_20250209_174719071.jpg"
+import PXL_20250209_175134355 from "./images/plants/PXL_20250209_175134355.jpg"
+import PXL_20250211_151038493 from "./images/plants/PXL_20250211_151038493.jpg"
+import PXL_20250212_142126974 from "./images/plants/PXL_20250212_142126974.jpg"
+import PXL_20250212_142920774 from "./images/plants/PXL_20250212_142920774.jpg"
+import PXL_20250212_144259621 from "./images/plants/PXL_20250212_144259621.jpg"
+import PXL_20250212_153335886 from "./images/plants/PXL_20250212_153335886.jpg"
+import PXL_20250212_154036484 from "./images/plants/PXL_20250212_154036484.jpg"
+import PXL_20250212_161706087 from "./images/plants/PXL_20250212_161706087.jpg"
+import PXL_20250212_163000971 from "./images/plants/PXL_20250212_163000971.jpg"
+
+<ImageGallery client:load/>
+
+
+Bilder von meiner Reise nach Madeira im Februar 2025.
+
+## Porto Moniz
+
+<Picture caption="Die abendliche Küste Madeiras for Porto Moniz" src={MAX_0603} alt="Abendliche Küstenszene, Welle brechen über Steinen vor einem Restaurant"/>
+<Picture caption="Wellen in Porto Moniz" src={MAX_0505} alt="Welle bricht über Steinen, Gischt fliegt hoch in die Luft, sieht aus wie ein Pferd"/>
+<Picture caption="Weitere Bilder von den Wellen vor Porto Moniz" src={MAX_0442} alt="Eine in der Zeit gefrorene Welle bricht über Felsen"/>
+<Picture caption="Panorama aus Porto Moniz Richtung Seixal" src={MAX_0447_Panorama} alt="Panorama Aufnahme der Küste von Madeira große Felsen im Wasser, blaue Berge in der Ferne"/>
+<Picture caption="Angelnde Menschen in Porto Moniz" src={MAX_0463} alt="Drei Menschen stehen im Hafen und Angeln vor einem roten Auto"/>
+
+## Levada Nova Wanderung
+
+<Picture caption="Frauenhaarfarn, Adiantum Capillus-veneris ist eine meiner Lieblingspflanzen, sie ist sehr weit verbreitet" src={MAX_0354} alt="Nahaufnahme eines grünen Frauenhaarfarns"/>
+<Image src={PXL_20250209_132548610} alt="Ich stehe auf einem Metalgerüst in den Bergen"/>
+<Image src={PXL_20250209_133848550} alt="Ich vor einem Wasserfall"/>
+
+## Seixal
+
+<Picture src={PXL_20250210_150929413} caption="Wunderschöner Raum mit Aussicht aufs Meer im Postbüro von Seixal" alt=""/>
+<Picture caption="Nebelige Bergspitzen über Seixal" src={MAX_0369} alt="Nebelige, dicht bewaldete Bergspitzen erheben sich hoch übereinander"/>
+
+## Wanderung um den Pico Arieiro
+
+<video src={PXL_20250211_174301568} controls alt="POV von einer Person die über eine felsige Brücke im Nebel geht"/>
+<Image src={PXL_20250211_181321910} alt="Kurvige Straße, zwischen roten, erdigen Hügeln"/>
+
+## Wanderung um Porto da Cruz
+
+<Image src={PXL_20250212_181932180} alt="Ich sitze in einem Riesenfarn"/>
+
+## Whale watching
+
+<Picture caption="Ein junger Buckelwal übt Sprünge für die Paarungszeit an der Küste vor Calheta" src={MAX_0646} alt="Buckelwal springt aus dem Wasser"/>
+
+Während ich unterwegs bin, fotografiere ich gerne Pflanzen die mir auffallen. Hier sind ein paar Bilder von interessanten Pflanzen die ich auf Madeira gesehen habe. Zum identifizieren der Pflanzen habe ich die App [PlantNet](https://identify.plantnet.org/de) benutzt.
+
+<ImageSlider title="Interessante Pflanzen der Insel" client:load>
+  <Image src={plant1} alt="Dracaena reflexa (Drachenbaum)"/>
+  <Image src={plant2} alt="Oxalis pes-caprae (Nickender Sauerklee)"/>
+  <Image src={PXL_20250212_144259621} alt="Oxalis purpurea (Herbst-Sauerklee)"/>
+  <Image src={PXL_20250212_154036484} alt="Bituminaria bituminosa (Gewöhnlicher-Asphaltklee)"/>
+  <Image src={PXL_20250209_125919043} alt="Galactites tomentosus (Milchdistel)"/>
+  <Image src={PXL_20250209_134733435} alt="Sonchus fruticosus (Strauchartige Gänsedistel)"/>
+  <Image src={PXL_20250209_174719071} alt="Persicaria capitata (Kopf-Knöterich)"/>
+  <Image src={PXL_20250209_175134355} alt="Rhaphiolepis bibas (Japanische Mispel)"/>
+  <Image src={PXL_20250211_151038493} alt="Psidium cattleyanum (Erdbeerguave)"/>
+  <Image src={PXL_20250212_142920774} alt="Tecoma stans (Gelber Trompetenstrauch)"/>
+  <Image src={PXL_20250212_153335886} alt="Roldana petasitis (Pestwurz-Greiskraut)"/>
+  <Image src={PXL_20250212_161706087} alt="Bidens pilosa (Zweizahn)"/>
+  <Image src={PXL_20250212_163000971} alt="Crassula multicava  (Affenbrotbaum)"/>
+  <Image src={PXL_20250209_173041299} alt="Irgendeine Sorte Liverwort evt. Targionia lorbeeria"/>
+  <Image src={plant3} alt="Aeonium canariense (Kanaren-Aeonium)"/>
+</ImageSlider>

src/i18n/utils.ts

@@ -1,4 +1,4 @@
-import { defaultLocale, getLocale } from 'astro-i18n-aut';
+import { defaultLocale, getLocale, locales } from 'astro-i18n-aut';
 import { ui, defaultLang, showDefaultLang } from './ui';
 
 export function useTranslatedPath(url: URL) {
@@ -17,9 +17,13 @@ export function useTranslations(url: URL) {
 
 export function parseSlug(id: string) {
   const splitPath = id.split('/');
-  const split = splitPath.pop()?.split('.');
-  const lang = split?.length === 2 ? defaultLocale : split?.[1];
-  return [splitPath.join("/"), lang]
+  const split = splitPath.pop()?.split('.').map(s => s.replace(/^index/, ""));
+  for (const s of split || []) {
+    if (locales[s]) {
+      return [splitPath[0] ?? id, s]
+    }
+  }
+  return [splitPath[0] ?? id, defaultLocale]
 }
 
 export function filterCollection<T extends { id: string, data: { draft?: boolean, date?: Date } }>(collection: T[], locale: string): T[] {

src/pages/blog/[slug].astro

@@ -1,16 +1,16 @@
 ---
-import { getCollection } from "astro:content";
+import { getCollection, render } from "astro:content";
 import { getLocale } from "astro-i18n-aut";
 import { filterCollection, parseSlug } from "@i18n/utils";
 
 const locale = getLocale(Astro.url);
 
 export async function getStaticPaths() {
-  const pages = await getCollection("blog");
+  const posts = await getCollection("blog");
 
-  const paths = pages.map((page) => {
-    const [slug] = parseSlug(page.id);
-    return { params: { slug }, props: { ...page } };
+  const paths = posts.map((post) => {
+    const [slug] = parseSlug(post.id);
+    return { params: { slug }, props: { ...post } };
   });
 
   return paths;
@@ -28,7 +28,7 @@ if (!page) {
   });
 }
 
-const { Content } = await page.render();
+const { Content } = await render(page);
 ---
 
 <Content />

src/pages/photos/[slug].astro

@@ -1,5 +1,5 @@
 ---
-import { getCollection } from "astro:content";
+import { getCollection, render } from "astro:content";
 import { getLocale } from "astro-i18n-aut";
 import { filterCollection, parseSlug } from "@i18n/utils";
 
@@ -19,6 +19,7 @@ export async function getStaticPaths() {
 const pages = await getCollection("photos");
 const page = filterCollection(pages, locale).find((page) => {
   const [slug] = parseSlug(page.id);
+  console.log({ slug, id: page.id, params: Astro.params.slug, locale });
   return slug === Astro.params.slug;
 });
 
@@ -28,7 +29,7 @@ if (!page) {
   });
 }
 
-const { Content } = await page.render();
+const { Content } = await render(page);
 ---
 
 <Content />

src/pages/projects/[slug].astro

@@ -1,5 +1,5 @@
 ---
-import { getCollection } from "astro:content";
+import { getCollection, render } from "astro:content";
 import { getLocale } from "astro-i18n-aut";
 import { filterCollection, parseSlug } from "@i18n/utils";
 
@@ -28,7 +28,7 @@ if (!page) {
   });
 }
 
-const { Content } = await page.render();
+const { Content } = await render(page);
 ---
 
 <Content />

svelte.config.js

@@ -1,5 +1,5 @@
 import { vitePreprocess } from '@astrojs/svelte';
 
 export default {
-	preprocess: vitePreprocess(),
+  preprocess: vitePreprocess(),
 }

tsconfig.json

@@ -1,5 +1,9 @@
 {
-  "extends": "astro/tsconfigs/strict",
+  "extends": "astro/tsconfigs/base",
+  "include": [
+    ".astro/types.d.ts",
+    "**/*"
+  ],
   "exclude": [
     "dist"
   ],