crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-05-15 22:16:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

Group hover on grid tile image

Browse Source
This commit is contained in:
Rein van Haaren 2023-08-08 22:28:13 +02:00 committed by GitHub
parent 74b5a25120
commit 2cb028b9d6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 2 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
components/grid/tile.tsx
View File

@ -20,7 +20,7 @@ export function GridTileImage({
return ( return (
<div <div
className={clsx( className={clsx(
'flex h-full w-full items-center justify-center overflow-hidden rounded-lg border bg-white hover:border-blue-600 dark:bg-black', 'flex h-full w-full items-center justify-center overflow-hidden rounded-lg border group bg-white hover:border-blue-600 dark:bg-black',
{ {
relative: label, relative: label,
'border-2 border-blue-600': active, 'border-2 border-blue-600': active,
@ -32,7 +32,7 @@ export function GridTileImage({
// eslint-disable-next-line jsx-a11y/alt-text -- `alt` is inherited from `props`, which is being enforced with TypeScript // eslint-disable-next-line jsx-a11y/alt-text -- `alt` is inherited from `props`, which is being enforced with TypeScript
<Image <Image
className={clsx('relative h-full w-full object-contain', { className={clsx('relative h-full w-full object-contain', {
'transition duration-300 ease-in-out hover:scale-105': isInteractive 'transition duration-300 ease-in-out group-hover:scale-105': isInteractive
})} })}
{...props} {...props}
/> />