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

make open and close cart button icons scale on button hover, not just on icon hover

Browse Source
This commit is contained in:
stabildev 2023-11-12 19:11:33 +01:00
parent 2fe1527bea
commit a8ac088118
2 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
components/cart/close-cart.tsx
View File

@ -3,8 +3,8 @@ import clsx from 'clsx';
export default function CloseCart({ className }: { className?: string }) { export default function CloseCart({ className }: { className?: string }) {
return ( return (
<div className="relative flex h-11 w-11 items-center justify-center rounded-md border border-neutral-200 text-black transition-colors dark:border-neutral-700 dark:text-white"> <div className="group relative flex h-11 w-11 items-center justify-center rounded-md border border-neutral-200 text-black transition-colors dark:border-neutral-700 dark:text-white">
<XMarkIcon className={clsx('h-6 transition-all ease-in-out hover:scale-110 ', className)} /> <XMarkIcon className={clsx('h-6 transition-all ease-in-out group-hover:scale-110 ', className)} />
</div> </div>
); );
} }

4
components/cart/open-cart.tsx
View File

@ -9,9 +9,9 @@ export default function OpenCart({
quantity?: number; quantity?: number;
}) { }) {
return ( return (
<div className="relative flex h-11 w-11 items-center justify-center rounded-md border border-neutral-200 text-black transition-colors dark:border-neutral-700 dark:text-white"> <div className="group relative flex h-11 w-11 items-center justify-center rounded-md border border-neutral-200 text-black transition-colors dark:border-neutral-700 dark:text-white">
<ShoppingCartIcon <ShoppingCartIcon
className={clsx('h-4 transition-all ease-in-out hover:scale-110 ', className)} className={clsx('h-4 transition-all ease-in-out group-hover:scale-110 ', className)}
/> />
{quantity ? ( {quantity ? (