feat: release 2.18.1

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.18.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.18.1",
   "homepage": "https://www.alexlebens.dev",
   "bugs": {
     "url": "https://gitea.alexlebens.dev/alexlebens/site-profile/issues",

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}`}
+    class:list={['col-start-1 row-start-1 transition-all duration-400 ease-in-out opacity-100 scale-100 dark:opacity-0 dark:scale-65', style]}
-    inferSize={true}
     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}`}
+    class:list={['col-start-1 row-start-1 transition-all duration-400 ease-in-out opacity-0 scale-65 dark:opacity-100 dark:scale-100', style]}
-    inferSize={true}
     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>