replace hero

Author: loftwah

src/assets/images/hero.png

@@ -4,13 +4,12 @@ import Directory from '../components/Directory.astro';
 import { getDirectoryProfiles } from '../data';
 import { Image } from 'astro:assets';
 import backgroundImage from '../assets/background.svg';
-import ogImage from '../assets/images/linkarooie_og.jpg';
-import ogImageLight from '../assets/images/linkarooie_og_light.jpg';
+import heroImage from '../assets/images/hero.png';
 
 const directoryProfiles = getDirectoryProfiles();
 ---
 
-<Layout title="Linkarooie - Simplify your online presence" ogImage={ogImage}>
+<Layout title="Linkarooie - Simplify your online presence" ogImage={heroImage}>
   <!-- Hero Section -->
   <div class="relative overflow-hidden bg-gradient-to-br from-gray-100 to-gray-200 dark:from-gray-900 dark:to-gray-800">
     <div class="absolute inset-0 z-0 opacity-20">
@@ -30,20 +29,13 @@ const directoryProfiles = getDirectoryProfiles();
           A Linktree-style app to showcase your profile, links, and achievements
         </p>
 
-        <!-- OG Image Display -->
+        <!-- Hero Image Display -->
         <div class="mt-6 sm:mt-8 flex justify-center px-4 sm:px-0">
           <div class="relative rounded-xl overflow-hidden shadow-xl w-full max-w-sm sm:max-w-md border-2 border-[#9333ea]/20 dark:border-[#a5fd0e]/20">
-            <!-- Light mode image (hidden in dark mode) -->
             <Image 
-              src={ogImageLight} 
+              src={heroImage} 
               alt="Linkarooie Preview" 
-              class="w-full h-auto transform hover:scale-105 transition-transform duration-300 dark:hidden"
-            />
-            <!-- Dark mode image (hidden in light mode) -->
-            <Image 
-              src={ogImage} 
-              alt="Linkarooie Preview" 
-              class="w-full h-auto transform hover:scale-105 transition-transform duration-300 hidden dark:block"
+              class="w-full h-auto transform hover:scale-105 transition-transform duration-300"
             />
           </div>
         </div>