From b1041898a32aa59e6a0b6ab55505e5a302749b73 Mon Sep 17 00:00:00 2001
From: Simeon Radivoev <simeonradivoev@gmail.com>
Date: Wed, 6 May 2026 22:53:11 +0300
Subject: [PATCH] fix: Used astro's image component

---
 src/components/Hero.astro        | 7 ++++++-
 src/components/Screenshots.astro | 9 +++++----
 2 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/components/Hero.astro b/src/components/Hero.astro
index 6fce4c7..95c547e 100644
--- a/src/components/Hero.astro
+++ b/src/components/Hero.astro
@@ -3,11 +3,16 @@ import screenshot from "../assets/screenshots/3dscreenshot.webp";
 import { Dot, Download } from "@lucide/astro";
 import { Github } from "simple-icons-astro";
 import pkg from "../../package.json";
+import { Image } from "astro:assets";
 ---
 
 <div class="hero bg-base-100 py-16 md:p-0 md:min-h-[calc(100vh-19rem)]">
   <div class="hero-content flex-col lg:flex-row gap-8 md:p-16 rounded-4xl">
-    <img src={screenshot.src} class="md:max-w-sm rounded-2xl shadow-2xl" />
+    <Image
+      src={screenshot}
+      alt="Gameflow Hero Image showing the app UI with retro games installed."
+      class="md:max-w-sm rounded-2xl shadow-2xl"
+    />
     <div>
       <small
         class="flex text-base-content/40 gap-2 justify-center md:justify-start items-center mb-2"
diff --git a/src/components/Screenshots.astro b/src/components/Screenshots.astro
index d12b3af..6753a13 100644
--- a/src/components/Screenshots.astro
+++ b/src/components/Screenshots.astro
@@ -1,21 +1,22 @@
 ---
-import { Image } from "@lucide/astro";
+import { ImageIcon } from "@lucide/astro";
+import { Image } from "astro:assets";
 const images = import.meta.glob("../assets/screenshots/*.webp", {
   eager: true,
 });
 ---
 
-<div class="divider sm:my-8 md:my-16"><Image size={48} />Screenshots</div>
+<div class="divider sm:my-8 md:my-16"><ImageIcon size={48} />Screenshots</div>
 <div
   class="columns-1 sm:columns-2 md:columns-3 lg:columns-4 gap-4 sm:p-8 md:p-16"
 >
   {
     Object.values(images).map((img: any, i) => (
       <a href={img.default.src} target="_blank">
-        <img
+        <Image
           class="mb-4 w-full rounded-xl"
           alt={`Screenshot ${i}`}
-          src={img.default.src}
+          src={img.default}
           loading="lazy"
         />
       </a>