summaryrefslogtreecommitdiff
path: root/src/components/products/ProductCard.js
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/products/ProductCard.js')
-rw-r--r--src/components/products/ProductCard.js11
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>
) : ''}