From 3eae720221fb5b895942589e3ac5b1cd9825b426 Mon Sep 17 00:00:00 2001
From: Alex Lebens <alexanderlebens@gmail.com>
Date: Tue, 3 Mar 2026 14:00:40 -0600
Subject: [PATCH] feat: shorten transition time

---
 src/components/buttons/ThemeToggleButton.astro | 4 ++--
 src/components/images/ImageTheme.astro         | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/buttons/ThemeToggleButton.astro b/src/components/buttons/ThemeToggleButton.astro
index 5cfed72..75dcf89 100644
--- a/src/components/buttons/ThemeToggleButton.astro
+++ b/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 }
diff --git a/src/components/images/ImageTheme.astro b/src/components/images/ImageTheme.astro
index 0135bfa..0856220 100644
--- a/src/components/images/ImageTheme.astro
+++ b/src/components/images/ImageTheme.astro
@@ -8,7 +8,7 @@ const { srcLight, srcDark, alt, style, width, height } = Astro.props;
   <Image
     src={srcLight}
     alt={alt}
-    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]}
+    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}
@@ -17,7 +17,7 @@ const { srcLight, srcDark, alt, style, width, height } = Astro.props;
   <Image
     src={srcDark}
     alt={alt}
-    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]}
+    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}