This commit is contained in:
StephDietz 2023-07-10 17:08:20 -05:00
parent 27a839eb86
commit 79c6870267
3 changed files with 9 additions and 9 deletions

View File

@ -33,7 +33,7 @@ const inter = Inter({
export default async function RootLayout({ children }: { children: ReactNode }) {
return (
<html lang="en" className={inter.variable}>
<body className="text-black bg-gray-50 selection:bg-teal-300 dark:bg-dark dark:text-white dark:selection:bg-fuchsia-600 dark:selection:text-white">
<body className="bg-gray-50 text-black selection:bg-teal-300 dark:bg-dark dark:text-white dark:selection:bg-fuchsia-600 dark:selection:text-white">
<Navbar />
<Suspense>
<main>{children}</main>

View File

@ -10,8 +10,8 @@ export async function Carousel() {
if (!products?.length) return null;
return (
<div className="relative w-full pb-6 overflow-hidden">
<div className="flex space-x-6 animate-carousel">
<div className="relative w-full overflow-hidden pb-6">
<div className="flex animate-carousel space-x-6">
{[...products, ...products].map((product, i) => (
<Link
key={`${product.handle}${i}`}
@ -21,18 +21,18 @@ export async function Carousel() {
{product.featuredImage ? (
<Image
alt={product.title}
className="object-contain h-full"
className="h-full object-contain"
fill
sizes="33vw"
src={product.featuredImage.url}
/>
) : null}
<div className="absolute bottom-0 left-0 flex items-center p-1 mb-2 ml-2 text-black border rounded-full bg-white/80 backdrop-blur-md dark:border-gray-800 dark:bg-black/80 dark:text-white md:mb-8 md:ml-8">
<h3 data-testid="product-name" className="inline pl-2 mr-6 text-xs font-semibold">
<div className="absolute bottom-0 left-0 mb-2 ml-2 flex items-center rounded-full border bg-white/80 p-1 text-black backdrop-blur-md dark:border-gray-800 dark:bg-black/80 dark:text-white md:mb-8 md:ml-8">
<h3 data-testid="product-name" className="mr-6 inline pl-2 text-xs font-semibold">
{product.title}
</h3>
<Price
className="flex-none p-2 text-xs font-semibold text-white bg-blue-600 rounded-full"
className="flex-none rounded-full bg-blue-600 p-2 text-xs font-semibold text-white"
amount={product.priceRange.maxVariantPrice.amount}
currencyCode={product.priceRange.maxVariantPrice.currencyCode}
/>

View File

@ -30,7 +30,7 @@ export function GridTileImage({
)}
>
{active !== undefined && active ? (
<span className="absolute w-full h-full bg-white opacity-25"></span>
<span className="absolute h-full w-full bg-white opacity-25"></span>
) : null}
{props.src ? (
<Image
@ -60,7 +60,7 @@ export function GridTileImage({
{labels.title}
</h3>
<Price
className="flex-none p-2 text-sm font-semibold text-white bg-blue-600 rounded-full"
className="flex-none rounded-full bg-blue-600 p-2 text-sm font-semibold text-white"
amount={labels.amount}
currencyCode={labels.currencyCode}
/>