4
0
forked from crowetic/commerce
This commit is contained in:
Belen Curcio 2020-10-24 19:14:34 -03:00
parent 1ba0967500
commit cd72d3a1ef
2 changed files with 16 additions and 6 deletions

View File

@ -1,10 +1,11 @@
import { ChangeEvent, useEffect, useState } from 'react'
import s from './CartItem.module.css'
import Image from 'next/image'
import Link from 'next/link'
import { ChangeEvent, useEffect, useState } from 'react'
import { Trash, Plus, Minus } from '@components/icon'
import usePrice from '@lib/bigcommerce/use-price'
import useUpdateItem from '@lib/bigcommerce/cart/use-update-item'
import useRemoveItem from '@lib/bigcommerce/cart/use-remove-item'
import s from './CartItem.module.css'
const CartItem = ({
item,
@ -53,7 +54,7 @@ const CartItem = ({
setQuantity(item.quantity)
}
}, [item.quantity])
console.log(item)
return (
<li className="flex flex-row space-x-8 py-8">
<div className="w-16 h-16 bg-violet relative overflow-hidden">
@ -67,7 +68,13 @@ const CartItem = ({
/>
</div>
<div className="flex-1 flex flex-col text-base">
<span className="font-bold mb-5">{item.name}</span>
{/** TODO: Replace this. No `path` found at Cart */}
<Link href={`/product/${item.url.split('/')[3]}`}>
<span className="font-bold mb-5 text-lg cursor-pointer">
{item.name}
</span>
</Link>
<div className="flex items-center">
<button type="button" onClick={() => increaseQuantity(-1)}>
<Minus width={18} height={18} />

View File

@ -36,6 +36,9 @@ export default function Cart({}: InferGetStaticPropsType<
const error = null
const success = null
console.log(items)
return (
<div className="grid lg:grid-cols-12">
<div className="lg:col-span-8">
@ -88,9 +91,9 @@ export default function Cart({}: InferGetStaticPropsType<
Before you leave, take a look at these items. We picked them just
for you
</Text>
<div className="flex py-6 space-x-2">
<div className="flex py-6 space-x-6">
{[1, 2, 3, 4, 5, 6].map((x) => (
<div className="border border-accents-3 w-full h-24 bg-accents-2 bg-opacity-50" />
<div className="border border-accents-3 w-full h-24 bg-accents-2 bg-opacity-50 transform cursor-pointer hover:scale-110 duration-75" />
))}
</div>
</div>