crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-07-23 04:36:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: playing around with styles and layout on PDP

Browse Source 
Signed-off-by: jrphilo <james.philo@me.com>
This commit is contained in:
jrphilo
2024-05-12 13:39:14 +02:00
parent 80db45a522
commit 598c1ad53e
9 changed files with 98 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
components/product/product-description.tsx
View File

@@ -12,7 +12,11 @@ export function ProductDescription({ product }: { product: Product }) {
return (
<>
<div className="mb-5 flex flex-col dark:border-neutral-700">
<h1 className="mb-3 text-2xl font-bold">{product.title}</h1>
<h1 className="text-xl font-bold md:text-2xl">{product.title}</h1>
<div className="mb-5 flex items-center justify-start gap-x-2">
<p className="text-sm">SKU: 123456</p>
<p className="text-sm">Condition: Used</p>
</div>
<VariantPrice
variants={product.variants}
defaultPrice={product.priceRange.minVariantPrice}
@@ -33,11 +37,11 @@ export function ProductDescription({ product }: { product: Product }) {
/>
) : null}
<div className="mb-4 border-t pb-4 pt-6 dark:border-neutral-700">
<div className="mb-2 border-t py-4 dark:border-neutral-700">
<CoreCharge variants={product.variants} />
</div>
<div className="mb-4 border-t py-6 dark:border-neutral-700">
<div className="mb-2 border-t py-4 dark:border-neutral-700">
<Warranty />
</div>