crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-07-22 12:24:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

✨ feat: Delivery Item

Browse Source
This commit is contained in:
sonnguyenkieio
2021-09-09 15:43:50 +07:00
parent 717ff0fa27
commit 06fc9cb288
4 changed files with 7 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/modules/account/DeliveryItem/DeliveryItem.tsx
View File

@@ -22,7 +22,7 @@ const DeliveryItem = ({ id, status, products, totalPrice, reOrderLink } : Delive
<div className={s.separator}></div> <div className={s.separator}></div>
<Products products={products} /> <Products products={products} />
<TotalPrice totalPrice={totalPrice} /> <TotalPrice totalPrice={totalPrice} />
<ReOrder show={status==="delivered" ? "show" : ""} href={reOrderLink} /> <ReOrder show={status==="delivered" ? true : false} href={reOrderLink} />
</section> </section>
) )
} }

2
src/components/modules/account/DeliveryItem/components/IdAndStatus/IdAndStatus.module.scss
View File

@@ -24,7 +24,7 @@
background-color: var(--info-dark); background-color: var(--info-dark);
} }
&.delivered { &.delivered {
background-color: var(--positive); background-color: var(--primary);
} }
} }
} }

4
src/components/modules/account/DeliveryItem/components/ReOrder/ReOrder.module.scss
View File

@@ -1,10 +1,10 @@
@import '../../../../../../styles/utilities'; @import '../../../../../../styles/utilities';
.reOrder { .reOrder {
@apply text-white custom-border-radius hidden; @apply text-white custom-border-radius hidden font-bold;
padding: .8rem 1.2rem; padding: .8rem 1.2rem;
margin-right: 2.4rem; margin-right: 2.4rem;
background-color: var(--positive); background-color: var(--primary);
&.show { &.show {
@apply block; @apply block;

7
src/components/modules/account/DeliveryItem/components/ReOrder/ReOrder.tsx
View File

@@ -3,16 +3,15 @@ import React from "react"
import s from './ReOrder.module.scss' import s from './ReOrder.module.scss'
import Link from 'next/link' import Link from 'next/link'
interface ReOrderProps { interface ReOrderProps {
show: string; show: boolean;
href?: string; href?: string;
} }
const ReOrder = ({ show="", href="#" } : ReOrderProps) => { const ReOrder = ({ show=false, href="#" } : ReOrderProps) => {
return ( return (
<div className={classNames(s.reOrder, { <div className={classNames(s.reOrder, {
[s[show]]: show [s.show]: show
})}> })}>
<Link href={href}> <Link href={href}>
<a>Re-Order</a> <a>Re-Order</a>