clients/phobos
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

chore: adjust cards and images to look better

Browse source
This commit is contained in:
Lio 2025-08-20 12:25:31 +02:00
parent fafd6cfe27
commit 029d8b9ce5
2 changed files with 5 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/components/Card.astro
View file

@ -1,6 +1,5 @@
--- ---
import pb from "../lib/pb"; import pb from "../lib/pb";
const { href, title, body, image } = Astro.props; const { href, title, body, image } = Astro.props;
let imageURL; let imageURL;
@ -10,11 +9,12 @@ if (image) {
--- ---
<div class="relative max-w-xl mx-auto mt-20 h-32 w-55"> <div class="relative max-w-xl mx-auto mt-20 h-32 w-55">
<a href={href} class="block"> <a href={href} class="block backdrop-blur-md rounded-md h-32 w-64">
{ {
image && ( image && (
<img <img
class="h-32 w-64 object-cover rounded-md" class="h-32 w-64 object-cover rounded-md"
// @ts-ignore
src={imageURL} src={imageURL}
alt={`Cover for ${title}`} alt={`Cover for ${title}`}
/> />

4
src/components/Image.astro
View file

@ -31,9 +31,9 @@ const showNsfw = Astro.url.searchParams.has('nsfw') || false;
<div <div
data-lightbox="true" data-lightbox="true"
id="parent" id="parent"
class=`relative overflow-hidden rounded mb-4 border border-transparent hover:border-gray-300 transition-all duration-300 ease-in-out hover:shadow-lg w-52` class='rounded-lg relative overflow-hidden mb-4 border border-transparent hover:border-gray-300 transition-all duration-300 ease-in-out hover:shadow-lg w-52'
> >
<img src={src} alt={`${alt !== '' ? `${alt}<br>` : ""} ${artist ? `by ${artist}` : ""}`} loading="lazy" /> <img class="rounded-lg" src={src} alt={`${alt !== '' ? `${alt}<br>` : ""} ${artist ? `by ${artist}` : ""}`} loading="lazy" />
{ {
alt && ( alt && (
<div <div