cx/commerce
4
0
Fork 0
forked from crowetic/commerce
Code Pull Requests Activity

Add link for slim version of product card

Browse Source
This commit is contained in:
Martin Bavio 2020-10-27 00:31:44 -03:00
parent 2c1f366f59
commit b23896998c
1 changed files with 44 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
components/product/ProductCard/ProductCard.tsx
View File

@ -31,8 +31,12 @@ const ProductCard: FC<Props> = ({
currencyCode: p.prices?.price?.currencyCode!, currencyCode: p.prices?.price?.currencyCode!,
}) })
if (variant === 'slim') {
return ( return (
<Link href={`/product${p.path}`}>
<a
className={cn(s.root, { [s.simple]: variant === 'simple' }, className)}
>
{variant === 'slim' ? (
<div className="relative overflow-hidden box-border"> <div className="relative overflow-hidden box-border">
<div className="absolute inset-0 flex items-center justify-end mr-8 z-20"> <div className="absolute inset-0 flex items-center justify-end mr-8 z-20">
<span className="bg-black text-white inline-block p-3 font-bold text-xl break-words"> <span className="bg-black text-white inline-block p-3 font-bold text-xl break-words">
@ -48,14 +52,8 @@ const ProductCard: FC<Props> = ({
quality="90" quality="90"
/> />
</div> </div>
) ) : (
} <>
return (
<Link href={`/product${p.path}`}>
<a
className={cn(s.root, { [s.simple]: variant === 'simple' }, className)}
>
<div className={s.squareBg} /> <div className={s.squareBg} />
<div className="flex flex-row justify-between box-border w-full z-20 absolute"> <div className="flex flex-row justify-between box-border w-full z-20 absolute">
<div className="absolute top-0 left-0 pr-16 max-w-full"> <div className="absolute top-0 left-0 pr-16 max-w-full">
@ -81,6 +79,8 @@ const ProductCard: FC<Props> = ({
quality="90" quality="90"
/> />
</div> </div>
</>
)}
</a> </a>
</Link> </Link>
) )