simeonradivoev/gameflow-website
simeonradivoev/gameflow-website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: Used astro's image component

Browse source
This commit is contained in:
Simeon Radivoev 2026-05-06 22:53:11 +03:00
parent 06f8a9abb5
commit b1041898a3
Signed by: simeonradivoev
GPG key ID: 7611A451D2A5D37A
2 changed files with 11 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

7
src/components/Hero.astro
View file

@ -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"

9
src/components/Screenshots.astro
View file

@ -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>