update UI for product description

This commit is contained in:
StephDietz
2023-07-11 09:34:38 -05:00
parent 25c91dc590
commit b2a3011ef1
4 changed files with 29 additions and 13 deletions

View File

@@ -2,10 +2,11 @@ import type { Metadata } from 'next';
import { notFound } from 'next/navigation';
import { Suspense } from 'react';
import { AddToCart } from 'components/cart/add-to-cart';
import Grid from 'components/grid';
import Footer from 'components/layout/footer';
import ProductGridItems from 'components/layout/product-grid-items';
import { AddToCart } from 'components/cart/add-to-cart';
import Price from 'components/price';
import { Gallery } from 'components/product/gallery';
import { VariantSelector } from 'components/product/variant-selector';
import Prose from 'components/prose';
@@ -97,10 +98,22 @@ export default async function ProductPage({ params }: { params: { handle: string
</div>
<div className="p-6 lg:col-span-2">
<div className="flex flex-col pb-6 mb-6 border-b dark:border-gray-700">
<h1 className="mb-2 text-5xl font-medium">{product.title}</h1>
<div className="w-auto p-2 mr-auto text-sm text-white bg-blue-600 rounded-full">
<Price
amount={product.priceRange.maxVariantPrice.amount}
currencyCode={product.priceRange.maxVariantPrice.currencyCode}
/>
</div>
</div>
<VariantSelector options={product.options} variants={product.variants} />
{product.descriptionHtml ? (
<Prose className="mb-6 text-sm leading-tight" html={product.descriptionHtml} />
<Prose
className="mb-6 text-sm leading-tight dark:text-white/[60%]"
html={product.descriptionHtml}
/>
) : null}
<AddToCart variants={product.variants} availableForSale={product.availableForSale} />