gamezonline/Radius
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Feat: apps page

Browse Source
This commit is contained in:
MotorTruck1221
2025-05-04 23:33:39 -06:00
parent 64728e5c43
commit 5e42a918ff
19 changed files with 88 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/ui/Card.astro
+35
View File
@@ -0,0 +1,35 @@
---
import { Image } from "astro:assets";
import type { ImageMetadata } from "astro";
const images = import.meta.glob<{ default: ImageMetadata }>(
"/src/assets/images/**/*.{jpeg,jpg,png,gif,webp}"
);
interface Props {
link?: string;
imageSrc: string;
text: string;
id: string;
};
const { imageSrc, text, id, link } = Astro.props;
---
{link ?
<a class="p-2" href={link}>
<div id={id} class="rounded-md relative group cursor-pointer h-36 hover:scale-105 duration-100 transition-all">
<Image loading="lazy" src={images[imageSrc]()} class="h-36 w-36 aspect-square object-cover rounded-md" alt={text} />
<div class="absolute inset-0 h-full w-full opacity-0 group-hover:opacity-100 bg-gradient-to-t from-(--accent) to-transparent rounded-b-md duration-100 flex items-end p-2 px-4 font-semibold">
<p> { text } </p>
</div>
</div>
</a>
:
<div class="p-2">
<div id={id} class="rounded-md relative group cursor-pointer h-36 hover:scale-105 duration-100 transition-all">
<Image loading="lazy" src={images[imageSrc]()} class="h-36 w-36 aspect-square object-cover rounded-md" alt={text} />
<div class="absolute inset-0 h-full w-full opacity-0 group-hover:opacity-100 bg-gradient-to-t from-(--accent) to-transparent rounded-b-md duration-100 flex items-end p-2 px-4 font-semibold">
<p> { text } </p>
</div>
</div>
</div>
}