crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-05-18 23:46:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

styling updates

Browse Source
This commit is contained in:
Gautam Velpula 2024-03-23 10:39:25 -04:00
parent e7004aea31
commit 5e0f8e22d7
6 changed files with 7 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
app/favicon.ico
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 2.6 KiB

2
components/cart/add-to-cart.tsx
View File

@ -17,7 +17,7 @@ function SubmitButton({
}) { }) {
const { pending } = useFormStatus(); const { pending } = useFormStatus();
const buttonClasses = const buttonClasses =
'relative flex w-full items-center justify-center rounded-full bg-blue-600 p-4 tracking-wide text-white'; 'relative flex w-full items-center justify-center rounded-md bg-0-fern_green-400 p-4 tracking-wide text-white';
const disabledClasses = 'cursor-not-allowed opacity-60 hover:opacity-60'; const disabledClasses = 'cursor-not-allowed opacity-60 hover:opacity-60';
if (!availableForSale) { if (!availableForSale) {

4
components/grid/tile.tsx
View File

@ -20,10 +20,10 @@ export function GridTileImage({
return ( return (
<div <div
className={clsx( className={clsx(
'group flex h-full w-full items-center justify-center overflow-hidden rounded-lg border bg-white hover:border-blue-600 dark:bg-black', 'group flex h-full w-full items-center justify-center overflow-hidden rounded-lg border bg-white hover:border-0-fern_green-600 dark:bg-black',
{ {
relative: label, relative: label,
'border-2 border-blue-600': active, 'border-2 border-0-fern_green-600': active,
'border-neutral-200 dark:border-neutral-800': !active 'border-neutral-200 dark:border-neutral-800': !active
} }
)} )}

2
components/home/hero.tsx
View File

@ -38,7 +38,7 @@ export function Hero({
<p>{ctaText3}</p> <p>{ctaText3}</p>
</p> </p>
<div className="mt-10 flex items-center gap-x-6"> <div className="mt-10 flex items-center gap-x-6">
<Link href="/landing"> <Link href="/search">
<span className="rounded-md bg-0-fern_green-600 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-0-fern_green-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-0-fern_green-600"> <span className="rounded-md bg-0-fern_green-600 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-0-fern_green-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-0-fern_green-600">
Shop Shop
</span> </span>

4
components/label.tsx
View File

@ -18,10 +18,10 @@ const Label = ({
'lg:px-20 lg:pb-[35%]': position === 'center' 'lg:px-20 lg:pb-[35%]': position === 'center'
})} })}
> >
<div className="flex items-center rounded-full border bg-white/70 p-1 text-xs font-semibold text-black backdrop-blur-md dark:border-neutral-800 dark:bg-black/70 dark:text-white"> <div className="flex items-center rounded-sm border bg-white/70 p-1 text-xs font-semibold text-black backdrop-blur-md dark:border-neutral-800 dark:bg-black/70 dark:text-white">
<h3 className="mr-4 line-clamp-2 flex-grow pl-2 leading-none tracking-tight">{title}</h3> <h3 className="mr-4 line-clamp-2 flex-grow pl-2 leading-none tracking-tight">{title}</h3>
<Price <Price
className="flex-none rounded-full bg-blue-600 p-2 text-white" className="flex-none rounded-md bg-0-fern_green-400 p-2 text-white"
amount={amount} amount={amount}
currencyCode={currencyCode} currencyCode={currencyCode}
currencyCodeClassName="hidden @[275px]/label:inline" currencyCodeClassName="hidden @[275px]/label:inline"

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

@ -9,7 +9,7 @@ export function ProductDescription({ product }: { product: Product }) {
<> <>
<div className="mb-6 flex flex-col border-b pb-6 dark:border-neutral-700"> <div className="mb-6 flex flex-col border-b pb-6 dark:border-neutral-700">
<h1 className="mb-2 text-5xl font-medium">{product.title}</h1> <h1 className="mb-2 text-5xl font-medium">{product.title}</h1>
<div className="mr-auto w-auto rounded-full bg-blue-600 p-2 text-sm text-white"> <div className="mr-auto w-auto rounded-md bg-0-fern_green-400 p-2 text-sm text-white">
<Price <Price
amount={product.priceRange.maxVariantPrice.amount} amount={product.priceRange.maxVariantPrice.amount}
currencyCode={product.priceRange.maxVariantPrice.currencyCode} currencyCode={product.priceRange.maxVariantPrice.currencyCode}