Vercel/src/photo/PhotoTiny.tsx
2024-02-29 22:47:34 -06:00

40 lines
870 B
TypeScript

import { Photo, titleForPhoto } from '.';
import ImageTiny from '@/components/ImageTiny';
import Link from 'next/link';
import { clsx } from 'clsx/lite';
import { pathForPhoto } from '@/site/paths';
export default function PhotoTiny({
photo,
tag,
selected,
className,
}: {
photo: Photo
tag?: string
selected?: boolean
className?: string
}) {
return (
<Link
href={pathForPhoto(photo, tag)}
className={clsx(
className,
'active:brightness-75',
selected && 'brightness-50',
'min-w-[50px]',
'rounded-[0.15rem] overflow-hidden',
'border border-gray-200 dark:border-gray-800',
)}
prefetch={false}
>
<ImageTiny
src={photo.url}
aspectRatio={photo.aspectRatio}
blurData={photo.blurData}
alt={titleForPhoto(photo)}
/>
</Link>
);
};