Skip to content

Commit

Permalink
fix(show/where-to-buy): invert logos in dark mode
Browse files Browse the repository at this point in the history
This patch updates the "where to buy" buttons to invert their brand or
retailer logos when the user switches to dark mode. Often, these logo
images will simply be PNGs or SVGs with black text on a clear
background. Inverting them gives us a nice logo for dark mode: white
text on a clear background.

Fixes: a909447 ("feat(routes/show): add "where to buy" section")
  • Loading branch information
nicholaschiang committed Jul 23, 2023
1 parent 25b9ed6 commit cbd35d6
Showing 1 changed file with 1 addition and 1 deletion.
2 changes: 1 addition & 1 deletion app/routes/shows.$showId/where-to-buy.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,7 @@ function BuyLink({
rel='noopener noreferrer'
className={cn(buttonVariants({ variant: 'outline' }), 'h-auto')}
>
{avatar != null && <img src={avatar} alt={alt} />}
{avatar != null && <img className='dark:invert' src={avatar} alt={alt} />}
{avatar == null && alt}
</a>
)
Expand Down

0 comments on commit cbd35d6

Please sign in to comment.