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

add hover state to tile

Browse Source
This commit is contained in:
StephDietz 2023-07-13 12:07:05 -05:00
parent 5e2035d70c
commit abf511fede
2 changed files with 4 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
components/grid/tile.tsx
View File

@ -7,11 +7,13 @@ export function GridTileImage({
active,
labelPosition,
labels,
hoverBorder,
...props
}: {
isInteractive?: boolean;
active?: boolean;
labelPosition?: 'bottom' | 'center';
hoverBorder?: boolean;
labels?: {
title: string;
amount: string;
@ -26,6 +28,7 @@ export function GridTileImage({
active !== undefined && active
? 'border-2 border-blue-600'
: 'border-gray-200 dark:border-gray-800',
hoverBorder && 'hover:border-blue-600',
{
relative: labels
}

1
components/layout/product-grid-items.tsx
View File

@ -17,6 +17,7 @@ export default function ProductGridItems({ products }: { products: Product[] })
amount: product.priceRange.maxVariantPrice.amount,
currencyCode: product.priceRange.maxVariantPrice.currencyCode
}}
hoverBorder={true}
src={product.featuredImage?.url}
width={600}
height={600}