From 78b37b169c23a404594deb35a684c3ec4f272390 Mon Sep 17 00:00:00 2001
From: Richard Bergsma <richard@365devnet.eu>
Date: Sun, 15 Jun 2025 19:28:38 +0200
Subject: [PATCH] Update shimmer effect styles in ModernCertifications,
 ModernEducation, and ModernWorkExperience components for improved dark mode
 support

- Changed shimmer effect gradient from white to black for better visibility in light mode.
- Ensured consistent styling across all three components to enhance user experience and visual appeal.
---
 src/components/widgets/ModernCertifications.astro | 2 +-
 src/components/widgets/ModernEducation.astro      | 2 +-
 src/components/widgets/ModernWorkExperience.astro | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/widgets/ModernCertifications.astro b/src/components/widgets/ModernCertifications.astro
index 3df6ea9..da1d773 100644
--- a/src/components/widgets/ModernCertifications.astro
+++ b/src/components/widgets/ModernCertifications.astro
@@ -141,7 +141,7 @@ const getImageSrc = (imagePath: string) => {
               <div class="absolute inset-0 bg-gradient-to-r from-blue-500/5 to-purple-500/5 opacity-0 group-hover:opacity-100 transition-opacity duration-300 rounded-2xl"></div>
               
               <!-- Shimmer effect -->
-              <div class="absolute inset-0 bg-gradient-to-r from-transparent via-white/10 to-transparent -translate-x-full group-hover:translate-x-full transition-transform duration-700 ease-out"></div>
+              <div class="absolute inset-0 bg-gradient-to-r from-transparent via-black/10 to-transparent dark:via-white/10 -translate-x-full group-hover:translate-x-full transition-transform duration-700 ease-out"></div>
             </div>
           );
         })
diff --git a/src/components/widgets/ModernEducation.astro b/src/components/widgets/ModernEducation.astro
index 986b8f6..5fe1804 100644
--- a/src/components/widgets/ModernEducation.astro
+++ b/src/components/widgets/ModernEducation.astro
@@ -89,7 +89,7 @@ const getEducationStyle = (title: string) => {
           </div>
           
           <!-- Shimmer effect -->
-          <div class="absolute inset-0 bg-gradient-to-r from-transparent via-white/10 to-transparent -translate-x-full group-hover:translate-x-full transition-transform duration-700 ease-out"></div>
+          <div class="absolute inset-0 bg-gradient-to-r from-transparent via-black/10 to-transparent dark:via-white/10 -translate-x-full group-hover:translate-x-full transition-transform duration-700 ease-out"></div>
         </div>
       );
     })}
diff --git a/src/components/widgets/ModernWorkExperience.astro b/src/components/widgets/ModernWorkExperience.astro
index 84f97b5..46439b4 100644
--- a/src/components/widgets/ModernWorkExperience.astro
+++ b/src/components/widgets/ModernWorkExperience.astro
@@ -160,7 +160,7 @@ const getYearRange = (dateStr: string = '') => {
           )}
           
           <!-- Shimmer effect -->
-          <div class="absolute inset-0 bg-gradient-to-r from-transparent via-white/10 to-transparent -translate-x-full group-hover:translate-x-full transition-transform duration-700 ease-out"></div>
+          <div class="absolute inset-0 bg-gradient-to-r from-transparent via-black/10 to-transparent dark:via-white/10  /* Smart theme-aware shimmer */ to-transparent -translate-x-full group-hover:translate-x-full transition-transform duration-700 ease-out"></div>
         </div>
       );
     })}