fix(lightbox): fill the heart icon when liked (#538 follow-up)
@Tietge86 spotted that both branches of the heart-icon className were `text-white` — the conditional was a no-op, the `fill-current` class that would actually fill the icon was missing entirely. The button background was turning red on like, but the heart icon stayed as a white outline against the red, making it nearly invisible. Move text-white outside the conditional (always white against the red/dark backgrounds the button uses), and add fill-current to the liked branch so the heart fills in. Same shape as bug 2 of the original report — the like state needed to be visually unambiguous. PhotoLikes.tsx was already fixed in this PR; this catches the equivalent latent bug in the inline lightbox toolbar button. Also: bug 4 of the original report (recovery flow) turned out to be SMTP misconfig on the reporter's end (mailhog silently dropping emails), not a PicPeak bug. Confirmed in this thread; no further backend changes needed. Refs: #538
This commit is contained in:
@@ -662,7 +662,11 @@ export const PhotoLightbox: React.FC<PhotoLightboxProps> = ({
|
|||||||
aria-label={myLiked ? 'Unlike photo' : 'Like photo'}
|
aria-label={myLiked ? 'Unlike photo' : 'Like photo'}
|
||||||
title={myLiked ? 'Unlike' : 'Like'}
|
title={myLiked ? 'Unlike' : 'Like'}
|
||||||
>
|
>
|
||||||
<Heart className={`w-5 h-5 ${myLiked ? 'text-white' : 'text-white'}`} />
|
{/* fill-current on the liked state so the heart is
|
||||||
|
actually visible against the red background — both
|
||||||
|
branches were `text-white` only (#538 follow-on
|
||||||
|
bug from @Tietge86). */}
|
||||||
|
<Heart className={`w-5 h-5 text-white ${myLiked ? 'fill-current' : ''}`} />
|
||||||
</button>
|
</button>
|
||||||
{/* Aggregate like count is admin-only when the admin
|
{/* Aggregate like count is admin-only when the admin
|
||||||
has hidden feedback from guests (#538 bug 3). Without
|
has hidden feedback from guests (#538 bug 3). Without
|
||||||
|
|||||||
Reference in New Issue
Block a user