feat: release 2.20.1

Reviewed-on: #369

.gitea/workflows/release-image-gitea.yml

@@ -42,14 +42,14 @@ jobs:
         uses: actions/checkout@v6
 
       - name: Login to Registry
-        uses: docker/login-action@v3
+        uses: docker/login-action@v4
         with:
           registry: ${{ vars.REPOSITORY_HOST }}
           username: ${{ gitea.actor }}
           password: ${{ secrets.REPOSITORY_TOKEN }}
 
       - name: Login to Docker
-        uses: docker/login-action@v3
+        uses: docker/login-action@v4
         with:
           registry: ${{ vars.DH_REGISTRY }}
           username: ${{ secrets.DH_USERNAME }}
@@ -62,7 +62,7 @@ jobs:
 
       - name: Set up Docker Buildx
         id: buildx
-        uses: docker/setup-buildx-action@v3
+        uses: docker/setup-buildx-action@v4
         with:
           driver: kubernetes
           driver-opts: |
@@ -77,7 +77,7 @@ jobs:
 
       - name: Extract Metadata
         id: meta
-        uses: docker/metadata-action@v5
+        uses: docker/metadata-action@v6
         with:
           tags: |
             type=ref,event=branch
@@ -101,7 +101,7 @@ jobs:
           fi
 
       - name: Build and Push Image
-        uses: docker/build-push-action@v6
+        uses: docker/build-push-action@v7
         with:
           context: .
           push: true

.gitea/workflows/release-image-harbor.yml

@@ -42,14 +42,14 @@ jobs:
         uses: actions/checkout@v6
 
       - name: Login to Registry
-        uses: docker/login-action@v3
+        uses: docker/login-action@v4
         with:
           registry: ${{ vars.REGISTRY_HOST }}
           username: ${{ vars.REGISTRY_USER }}
           password: ${{ secrets.REGISTRY_SECRET }}
 
       - name: Login to Docker
-        uses: docker/login-action@v3
+        uses: docker/login-action@v4
         with:
           registry: ${{ vars.DH_REGISTRY }}
           username: ${{ secrets.DH_USERNAME }}
@@ -62,7 +62,7 @@ jobs:
 
       - name: Set up Docker Buildx
         id: buildx
-        uses: docker/setup-buildx-action@v3
+        uses: docker/setup-buildx-action@v4
         with:
           driver: kubernetes
           driver-opts: |
@@ -77,7 +77,7 @@ jobs:
 
       - name: Extract Metadata
         id: meta
-        uses: docker/metadata-action@v5
+        uses: docker/metadata-action@v6
         with:
           tags: |
             type=ref,event=branch
@@ -101,7 +101,7 @@ jobs:
           fi
 
       - name: Build and Push Image
-        uses: docker/build-push-action@v6
+        uses: docker/build-push-action@v7
         with:
           context: .
           push: true

Dockerfile

@@ -22,7 +22,7 @@ WORKDIR /app
 COPY --from=prod-deps /app/node_modules /app/node_modules
 COPY --from=build /app/dist /app/dist
 
-LABEL version="2.18.0"
+LABEL version="2.20.1"
 LABEL description="Astro based personal website"
 
 ENV HOST=0.0.0.0

package.json

@@ -1,7 +1,7 @@
 {
   "name": "site-profile",
   "type": "module",
-  "version": "2.18.0",
+  "version": "2.20.1",
   "homepage": "https://www.alexlebens.dev",
   "bugs": {
     "url": "https://gitea.alexlebens.dev/alexlebens/site-profile/issues",

pnpm-lock.yaml

@@ -28,7 +28,7 @@ importers:
         version: 3.7.0
       '@directus/sdk':
         specifier: ^21.1.0
-        version: 21.1.0
+        version: 21.2.0
       '@giscus/react':
         specifier: ^3.1.0
         version: 3.1.0(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
@@ -67,10 +67,10 @@ importers:
         version: 1.1.5
       marked:
         specifier: ^17.0.3
-        version: 17.0.3
+        version: 17.0.4
       marked-shiki:
         specifier: ^1.2.1
-        version: 1.2.1(marked@17.0.3)(shiki@4.0.1)
+        version: 1.2.1(marked@17.0.4)(shiki@4.0.1)
       mdast-util-to-string:
         specifier: ^4.0.0
         version: 4.0.0
@@ -803,8 +803,8 @@ packages:
     resolution: {integrity: sha512-VERIM64vtTP1C4mxQ5thVT9fK0apjPFobqybMtA1UdUujWka24ERHbRHFGmpbbhp73MhV+KSsHQH9C6uOTdEQA==}
     engines: {node: '>=18'}
 
-  '@directus/sdk@21.1.0':
-    resolution: {integrity: sha512-Ig8zZAQDbc7QMIM54N+x71C04lni9MN9yalNAezjDjFdNknTJzupDY7V5cb+kOJL8GsqDE9Bg8xq8xCmkDVs5A==}
+  '@directus/sdk@21.2.0':
+    resolution: {integrity: sha512-IrP6vpXqW0WYuwMcKa19odYZDVdTtBL4+0TaZeUGoNWgvncPcuTYVEtX4z93TEPfbFoSD0IwPx0gbhQ7YNbTGg==}
     engines: {node: '>=22'}
 
   '@dprint/formatter@0.5.1':
@@ -4032,8 +4032,8 @@ packages:
       marked: '>=7.0.0'
       shiki: '>=1.0.0'
 
-  marked@17.0.3:
-    resolution: {integrity: sha512-jt1v2ObpyOKR8p4XaUJVk3YWRJ5n+i4+rjQopxvV32rSndTJXvIzuUdWWIy/1pFQMkQmvTXawzDNqOH/CUmx6A==}
+  marked@17.0.4:
+    resolution: {integrity: sha512-NOmVMM+KAokHMvjWmC5N/ZOvgmSWuqJB8FoYI019j4ogb/PeRMKoKIjReZ2w3376kkA8dSJIP8uD993Kxc0iRQ==}
     engines: {node: '>= 20'}
     hasBin: true
 
@@ -6796,7 +6796,7 @@ snapshots:
     dependencies:
       fontkitten: 1.0.2
 
-  '@directus/sdk@21.1.0': {}
+  '@directus/sdk@21.2.0': {}
 
   '@dprint/formatter@0.5.1': {}
 
@@ -10387,12 +10387,12 @@ snapshots:
 
   markdown-table@3.0.4: {}
 
-  marked-shiki@1.2.1(marked@17.0.3)(shiki@4.0.1):
+  marked-shiki@1.2.1(marked@17.0.4)(shiki@4.0.1):
     dependencies:
-      marked: 17.0.3
+      marked: 17.0.4
       shiki: 4.0.1
 
-  marked@17.0.3: {}
+  marked@17.0.4: {}
 
   math-intrinsics@1.1.0: {}
 

src/components/buttons/ThemeToggleButton.astro

@@ -64,7 +64,7 @@
       const overlay = document.createElement('div');
       overlay.className = 'theme-switch-overlay fixed inset-0 pointer-events-none z-50';
       overlay.style.opacity = '0';
-      overlay.style.transition = 'opacity 0.3s ease-out';
+      overlay.style.transition = 'opacity 0.15s ease-out';
       document.body.appendChild(overlay);
     }
 
@@ -130,7 +130,7 @@
                   overlay.style.opacity = '0';
                 }
                 document.documentElement.classList.remove('theme-switching');
-              }, 300);
+              }, 150);
             }, 50);
           },
           { passive: false }

src/components/images/ImageTheme.astro

@@ -4,12 +4,11 @@ import { Image } from 'astro:assets';
 const { srcLight, srcDark, alt, style, width, height } = Astro.props;
 ---
 
-<div class="themed-image-container">
+<div class="grid grid-cols-1 grid-rows-1">
   <Image
     src={srcLight}
     alt={alt}
-    class={`light-logo ${style}`}
-    inferSize={true}
+    class:list={['col-start-1 row-start-1 transition-all duration-300 ease-in-out opacity-100 scale-100 dark:opacity-0 dark:scale-65', style]}
     width={width}
     height={height}
     inferSize={true}
@@ -18,29 +17,9 @@ const { srcLight, srcDark, alt, style, width, height } = Astro.props;
   <Image
     src={srcDark}
     alt={alt}
-    class={`dark-logo ${style}`}
-    inferSize={true}
+    class:list={['col-start-1 row-start-1 transition-all duration-300 ease-in-out opacity-0 scale-65 dark:opacity-100 dark:scale-100', style]}
     width={width}
     height={height}
     inferSize={true}
   />
 </div>
-
-<style>
-  .themed-image-container {
-    display: grid;
-    grid-template-areas: "stack";
-  }
-
-  .themed-image-container :global(img) {
-    grid-area: stack;
-  }
-
-  :global(.dark) .light-logo {
-    display: none !important;
-  }
-
-  :global(.dark) .dark-logo {
-    display: block !important;
-  }
-</style>

src/components/sections/CategorySection.astro

@@ -10,7 +10,7 @@ import { timeago } from '@support/time';
 const posts = await directus.request(
   readItems('posts', {
     filter: { published: { _eq: true } },
-    fields: ['*'],
+    fields: ['*', 'category.slug'],
     sort: ['-published_date'],
   })
 );
@@ -31,13 +31,16 @@ const layoutPattern = [
 const postMap: Map<string, Post[]> = posts
   .sort((a: Post, b: Post) => b.published_date.valueOf() - a.published_date.valueOf())
   .reduce((acc, obj) => {
-    let posts = acc.get(obj.category);
+    const categorySlug = obj.category?.slug;
+    if (!categorySlug) return acc;
+
+    let posts = acc.get(categorySlug);
     if (!posts) {
       posts = [];
     }
     posts.push(obj);
 
-    acc.set(obj.category, posts);
+    acc.set(categorySlug, posts);
 
     return acc;
   }, new Map<string, Post[]>());

src/components/sections/FeatureSection.astro

@@ -15,25 +15,29 @@ const global = await directus.request(readSingleton('site_global'));
           title="Cloud Engineer"
           description="Full stack and cloud engineer."
           url="/about"
-          logoUrlLight="https://img.icons8.com/cotton/64/cloud-development--v2.png"
+          logoUrlLight="https://directus.alexlebens.net/assets/8e674299-2dfc-4ea3-8193-a1c4050bf06f?key=system-large-contain&v=2026-02-26T21%3A23%3A22.457Z"
+          logoUrlDark="https://directus.alexlebens.net/assets/cdd6efce-3231-4213-8b1e-cae9c1b3a18f?key=system-large-contain&v=2026-03-03T19%3A30%3A01.263Z"
         />
         <FeaturesCard
           title="Homelab"
           description="Tinkering, testing, deploying, etc, etc ..."
           url="/categories/homelab/"
-          logoUrlLight="https://img.icons8.com/cotton/64/smart-home-connection.png"
+          logoUrlLight="https://directus.alexlebens.net/assets/4ccb3d9f-e203-4c2b-bfad-600f1aa5b7a4?key=system-large-contain&v=2026-02-26T21%3A25%3A30.853Z"
+          logoUrlDark="https://directus.alexlebens.net/assets/33fb6b45-1834-44a0-bc04-692be4f6d4ce?key=system-large-contain&v=2026-03-03T19%3A30%3A37.961Z"
         />
         <FeaturesCard
           title="Documentation"
           description="Reference and guides for my homelab."
           url="https://docs.alexlebens.dev"
-          logoUrlLight="https://img.icons8.com/cotton/64/bookmarked-document--v1.png"
+          logoUrlLight="https://directus.alexlebens.net/assets/5f5faad9-2c36-40a5-a519-f631d39ab388?key=system-large-contain&v=2026-03-03T19%3A49%3A43.620Z"
+          logoUrlDark="https://directus.alexlebens.net/assets/c49b40a9-ddf2-4fa2-ba35-6039682b93de?key=system-large-contain&v=2026-03-03T19%3A50%3A14.893Z"
         />
         <FeaturesCard
           title="Email"
           description={`Send me a message.`}
           url=`mailto:${global.email}`
-          logoUrlLight="https://img.icons8.com/cotton/64/secured-letter--v3.png"
+          logoUrlLight="https://directus.alexlebens.net/assets/4b1c771e-c709-4094-b018-0197b4747829?key=system-large-contain&v=2026-03-03T19%3A48%3A36.432Z"
+          logoUrlDark="https://directus.alexlebens.net/assets/cdf2ea11-fcfc-41f1-a701-43084fb06efa?key=system-large-contain&v=2026-03-03T19%3A47%3A28.109Z"
         />
       </div>
     </div>

src/layouts/BaseLayout.astro

@@ -93,15 +93,26 @@ const normalizeTitle = !title ? global.name : `${title} | ${global.name}`;
 
 <script>
   document.addEventListener('astro:page-load', () => {
+    let ticking = false;
     const onScroll = () => {
+      if (!ticking) {
+        window.requestAnimationFrame(() => {
           document.documentElement.style.setProperty('--scroll-offset', `${window.scrollY}px`);
-      document.documentElement.classList.add('has-js');
+          ticking = false;
+        });
+        ticking = true;
+      }
     };
 
-    window.removeEventListener('scroll', onScroll);
     window.addEventListener('scroll', onScroll, { passive: true });
     
     onScroll();
+
+    document.documentElement.classList.add('has-js');
+
+    document.addEventListener('astro:before-swap', () => {
+      window.removeEventListener('scroll', onScroll);
+    }, { once: true });
   });
 </script>
 
@@ -129,6 +140,7 @@ const normalizeTitle = !title ? global.name : `${title} | ${global.name}`;
 
     -webkit-mask-position-y: var(--scroll-offset);
     mask-position-y: var(--scroll-offset);
+    will-change: mask-position;
   }
 
   /* Background that creates the "glimmer" effect */

src/lib/directusTypes.ts

@@ -37,7 +37,7 @@ export type Post = {
   title: string;
   description: string;
   tags: string[];
-  category: string;
+  category: Category;
   selected: boolean;
   published: boolean;
   content: string;

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

@@ -17,7 +17,9 @@ import { getDirectusImageURL } from '@/support/url';
 const post = Astro.props;
 
 export async function getStaticPaths() {
-  const posts = await directus.request(readItems('posts'));
+  const posts = await directus.request(readItems('posts', {
+    fields: ['*', 'category.*'],
+  }));
   return posts.map((post) => ({
     params: { slug: post.slug },
     props: post,
@@ -25,12 +27,7 @@ export async function getStaticPaths() {
 }
 
 const global = await directus.request(readSingleton('site_global'));
-const [category] = post.category ? await directus.request(
-  readItems('categories', {
-    filter: { slug: { _eq: post.category },},
-    limit: 1,
-  }))
-  : [];
+const category = post.category;
 
 const readingTime = getReadingTime(post.content || '');
 

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

@@ -22,7 +22,7 @@ const global = await directus.request(readSingleton('site_global'));
 const posts = await directus.request(
   readItems('posts', {
     filter: { published: { _eq: true } },
-    fields: ['*'],
+    fields: ['*', 'category.slug'],
     sort: ['-published_date'],
   })
 );
@@ -30,7 +30,7 @@ const posts = await directus.request(
 const categoriesPosts = posts
   .sort((a: Post, b: Post) => b.published_date.valueOf() - a.published_date.valueOf())
   .filter((b) => {
-    return b.category === category.slug;
+    return b.category?.slug === category.slug;
   });
 ---