crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-05-11 12:17:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #8 from Car-Part-Planet/feat/add-sku

Browse Source 
Feat/add SKU
This commit is contained in:
jrphilo 2024-07-08 09:53:46 +02:00 committed by GitHub
commit 49c52b0129
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 14 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
components/product/vairant-details.tsx
View File

@ -30,12 +30,19 @@ const VariantDetails = ({ variants, defaultPrice }: VariantDetailsProps) => {
<div className="mt-2 flex items-center justify-start gap-x-2">
{variant?.availableForSale ? (
<div className="flex items-center gap-1 text-sm text-green-500">
<CheckCircleIcon className="size-5" /> In Stock
<CheckCircleIcon className="size-5" /> <strong>In Stock</strong>
</div>
) : (
<span className="text-sm text-red-600">Out of Stock</span>
)}
<p className="text-sm">Condition: {variant?.condition || 'N/A'}</p>
<span className="text-sm">|</span>
<p className="text-sm">
<strong>SKU:</strong> {variant?.sku || 'N/A'}
</p>
<span className="text-sm">|</span>
<p className="text-sm">
<strong>Condition:</strong> {variant?.condition || 'N/A'}
</p>
</div>
</div>
);

10
components/product/variant-selector.tsx
View File

@ -96,7 +96,7 @@ export function VariantSelector({
leaveFrom="opacity-100 backdrop-blur-[.5px]"
leaveTo="opacity-0 backdrop-blur-none"
>
<div className="fixed inset-0 bg-black/30" aria-hidden="true" />
<div className="bg-black/30 fixed inset-0" aria-hidden="true" />
</TransitionChild>
<TransitionChild
as={Fragment}
@ -107,7 +107,7 @@ export function VariantSelector({
leaveFrom="translate-x-0"
leaveTo="translate-x-full"
>
<DialogPanel className="fixed bottom-0 right-0 top-0 flex h-full w-full flex-col border-l border-neutral-200 bg-white/80 p-6 text-black backdrop-blur-xl md:w-[500px]">
<DialogPanel className="text-black fixed bottom-0 right-0 top-0 flex h-full w-full flex-col border-l border-neutral-200 bg-white/80 p-6 backdrop-blur-xl md:w-[500px]">
<div className="flex items-center justify-between">
<p className="text-lg font-semibold">Manufactured & Used Options</p>
@ -209,10 +209,10 @@ export function VariantSelector({
/>
) : null}
<div className="flex items-center gap-1">
<span className="text-xs font-medium text-gray-600">
{option.name}:
<span className="text-xs font-medium text-gray-600">SKU:</span>
<span className="text-xs text-gray-600">
{variant?.sku || 'N/A'}
</span>
<span className="text-xs text-gray-600">{value}</span>
</div>
</div>
{!isAvailableForSale ? <span>Out of Stock</span> : null}