Tweak photo tag layout

This commit is contained in:
Sam Becker 2023-09-18 20:03:50 -05:00
parent 552d4c4c12
commit 44027408a2

View File

@ -18,6 +18,8 @@ export default function PhotoLarge({
priority?: boolean priority?: boolean
prefetchShare?: boolean prefetchShare?: boolean
}) { }) {
const tagsToShow = photo.tags.filter(t => t !== tag);
const renderMiniGrid = (children: JSX.Element) => const renderMiniGrid = (children: JSX.Element) =>
<div className={cc( <div className={cc(
'flex gap-y-4', 'flex gap-y-4',
@ -49,14 +51,16 @@ export default function PhotoLarge({
'mb-4', 'mb-4',
)}> )}>
{renderMiniGrid(<> {renderMiniGrid(<>
<div>
<Link <Link
href={pathForPhoto(photo, tag)} href={pathForPhoto(photo, tag)}
className="font-bold uppercase" className="font-bold uppercase"
> >
{titleForPhoto(photo)} {titleForPhoto(photo)}
</Link> </Link>
{photo.tags.length > 0 && {tagsToShow.length > 0 &&
<PhotoTags tags={photo.tags} />} <PhotoTags tags={tagsToShow} />}
</div>
<div className="uppercase"> <div className="uppercase">
{photo.make} {photo.model} {photo.make} {photo.model}
</div> </div>