diff options
Diffstat (limited to 'src/components/products/ProductCard.js')
| -rw-r--r-- | src/components/products/ProductCard.js | 11 |
1 files changed, 7 insertions, 4 deletions
diff --git a/src/components/products/ProductCard.js b/src/components/products/ProductCard.js index e32463a7..c79a4900 100644 --- a/src/components/products/ProductCard.js +++ b/src/components/products/ProductCard.js @@ -5,7 +5,10 @@ import { ChevronRightIcon } from "@heroicons/react/20/solid"; import Image from "../elements/Image"; -export default function ProductCard({ data }) { +export default function ProductCard({ + data, + simpleProductTitleLine = false +}) { let product = data; return ( <div className="product-card"> @@ -26,7 +29,7 @@ export default function ProductCard({ data }) { ) : ( <span className="product-card__brand">-</span> )} - <Link href={'/shop/product/' + createSlug(product.name, product.id)} className="product-card__title wrap-line-ellipsis-3"> + <Link href={'/shop/product/' + createSlug(product.name, product.id)} className={`product-card__title ${simpleProductTitleLine ? 'wrap-line-ellipsis-2' : 'wrap-line-ellipsis-3'}`}> {product.name} </Link> </div> @@ -34,7 +37,7 @@ export default function ProductCard({ data }) { {product.lowest_price.discount_percentage > 0 ? ( <div className="flex gap-x-1 items-center mb-1"> <p className="text-caption-2 text-gray_r-11 line-through">{currencyFormat(product.lowest_price.price)}</p> - <span className="badge-red">{product.lowest_price.discount_percentage}%</span> + <span className="badge-solid-red">{product.lowest_price.discount_percentage}%</span> </div> ) : ''} @@ -55,7 +58,7 @@ export default function ProductCard({ data }) { {product.stock_total > 0 ? ( <div className="flex gap-x-1 mt-2"> - <div className="badge-green">Ready Stock</div> + <div className="badge-solid-red">Ready Stock</div> <div className="badge-gray">{product.stock_total > 5 ? '> 5' : '< 5'}</div> </div> ) : ''} |
