Rework #6
@ -1,7 +1,7 @@
|
||||
import type { Document } from "dbtype/api";
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card.tsx";
|
||||
import TagBadge from "@/components/gallery/TagBadge.tsx";
|
||||
import { Fragment, useEffect, useLayoutEffect, useRef, useState } from "react";
|
||||
import { Fragment, useLayoutEffect, useRef, useState } from "react";
|
||||
import { LazyImage } from "./LazyImage.tsx";
|
||||
import StyledLink from "./StyledLink.tsx";
|
||||
|
||||
@ -22,6 +22,7 @@ export function GalleryCard({
|
||||
}: { doc: Document; }) {
|
||||
const ref = useRef<HTMLUListElement>(null);
|
||||
const [clipCharCount, setClipCharCount] = useState(200);
|
||||
const isDeleted = x.deleted_at !== null;
|
||||
|
||||
const artists = x.tags.filter(x => x.startsWith("artist:")).map(x => x.replace("artist:", ""));
|
||||
const groups = x.tags.filter(x => x.startsWith("group:")).map(x => x.replace("group:", ""));
|
||||
@ -46,12 +47,15 @@ export function GalleryCard({
|
||||
}, []);
|
||||
|
||||
return <Card className="flex h-[200px]">
|
||||
<div className="rounded-xl overflow-hidden h-[200px] w-[142px] flex-none bg-[#272733] flex items-center justify-center">
|
||||
{isDeleted ? <div className="bg-primary border flex items-center justify-center h-[200px] w-[142px] rounded-xl">
|
||||
<span className="text-primary-foreground text-lg font-bold">Deleted</span>
|
||||
</div> : <div className="rounded-xl overflow-hidden h-[200px] w-[142px] flex-none bg-[#272733] flex items-center justify-center">
|
||||
<LazyImage src={`/api/doc/${x.id}/comic/thumbnail`}
|
||||
alt={x.title}
|
||||
className="max-h-full max-w-full object-cover object-center"
|
||||
/>
|
||||
</div>
|
||||
}
|
||||
<div className="flex-1 flex flex-col">
|
||||
<CardHeader className="flex-none">
|
||||
<CardTitle>
|
||||
|
Loading…
Reference in New Issue
Block a user