added fancy marker for latest update date in main page link row

src/lib/lists/link-row.svelte

@@ -1,8 +1,9 @@
 <script lang="ts">
-    export interface GalleryRowEntry {
+    export interface LinkRowEntry {
         title: string;
         description: string;
         img: string;
+        latestUpdate?: string;
         altText: string;
         link: string;
     }
@@ -10,7 +11,7 @@
     let {
         entries,
     }: {
-        entries: GalleryRowEntry[];
+        entries: LinkRowEntry[];
     } = $props();
 </script>
 
@@ -23,6 +24,9 @@
             <div class="row-text-container">
                 <p class="row-title">&gt; {entry.title}</p>
                 <p class="row-description">{@html entry.description}</p>
+                {#if entry.latestUpdate}
+                    <p class="row-updated">updated: <span class="row-updated-date">{entry.latestUpdate}</span></p>
+                {/if}
             </div>
         </a>
     {/each}
@@ -78,6 +82,7 @@
 
     .row-text-container {
         margin-top: 8px;
+        margin-bottom: 4px;
     }
 
     .row-title {
@@ -90,7 +95,38 @@
     .row-description {
         font-size: 1.0rem;
         line-height: 1.3rem;
-        margin: 0 0 4px 0;
+        margin: 0;
+    }
+
+    .row-updated, .row-updated-date {
+        font-size: 0.9rem;
+        line-height: 1.2rem;
+        margin: 0;
+        font-style: italic;
+        width: fit-content;
+        transition: color var(--duration-animation) var(--anim-curve),
+                    background-color var(--duration-animation) var(--anim-curve);
+    }
+
+    .row-updated {
+        margin-top: 2px;
+        padding: 4px 8px;
+        font-weight: 500;
+        background-color: var(--color-background-highlight);
+        border-radius: var(--border-radius);
+    }
+
+    .row-entry:hover .row-updated {
+        color: var(--color-text-dark);
+        background-color: var(--color-highlight);
+    }
+
+    .row-updated-date {
+        font-weight: 600;
+    }
+
+    .row-entry:hover .row-updated-date {
+        color: var(--color-text-dark);
     }
 
     @media screen and (max-width: 600px) {

src/routes/+page.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
     import Content from "$lib/viewport/content.svelte";
-    import GalleryRow, { type GalleryRowEntry } from "$lib/lists/gallery-row.svelte";
+    import LinkRow, { type LinkRowEntry } from "$lib/lists/link-row.svelte";
 
     import { posts as devlogPosts } from "./projects/projectn5/devlog/posts";
     import { posts as blogPosts } from "./blog/posts";
@@ -73,8 +73,6 @@
             <p>I listen to <b>a lot</b> of music. My favourite artists are <a href="https://acloudyskye.bandcamp.com/">acloudyskye</a>, <a href="https://jaronsteele.bandcamp.com/">Jaron</a>, <a href="https://janeremover.bandcamp.com/">Jane Remover</a>, but you can <a href="/meta/music-rotation">find my current rotation here</a>. I also enjoy dabbling around in cool FOSS tools like <a href="https://godotengine.org/">Godot</a>, <a href="https://blender.org/">Blender</a>, and <a href="https://krita.org/">Krita</a> which I use under <a href="https://fedoraproject.org/">Fedora KDE</a>. If you want to know more about me and this website, <a href="/meta/about">go here</a>!</p>
 
             <p>irl I am from 🇩🇪 Northern Germany and studying to become a secondary school teacher, but between you and me; I may end up doing something else :).</p>
-
-            <p>{latestFeedDate}</p>
         </div>
 
         <div>
@@ -101,11 +99,12 @@
 
     <hr>
 
-    <GalleryRow entries={
+    <LinkRow entries={
         [
             {
                 title: "Homesick – devlog",
-                description: `my active Godot game project about finding yourself in an unfamiliar future. <i>latest update: ${latestDevlogDate}</i>`,
+                description: `my active Godot game project about finding yourself in an unfamiliar future.`,
+                latestUpdate: latestDevlogDate,
                 img: "projects/projectn5/banner2.webp",
                 altText: "The protagonist Laura standing on a floating platform in the purple test level. Ziplines are all around her and the text 'When this text is spinning, the game is not paused' is frozen in the sky.",
                 link: "projects/projectn5",
@@ -119,18 +118,20 @@
             },
         ]} />
     
-    <GalleryRow entries={
+    <LinkRow entries={
         [
             {
                 title: "Creative Feed",
-                description: `the small things I make find a home here. <i>latest post: ${latestFeedDate}</i>`,
+                description: `the small things I make find a home here.`,
+                latestUpdate: latestFeedDate,
                 img: "feed/banner.webp",
                 altText: "A blue screen with the text 'how do you do art ? 1. face your fears 2. become your heroes'. The 'art' looks to have been edited in. The music artist Porter Robinson is standing in the bottom right corner.",
                 link: "feed",
             },
             {
                 title: "Blog",
-                description: `a place where I write about random things. <i>latest post: ${latestBlogDate}</i>`,
+                description: `a place where I write about random things.`,
+                latestUpdate: latestBlogDate,
                 img: "blog/robert.webp",
                 altText: "View at a tram bridge rising and then curving to the left.",
                 link: "blog",