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

Minor clsx adjustments

Browse Source
This commit is contained in:
Michael Novotny 2023-07-17 11:18:39 -05:00
parent c8af238979
commit 3c105aecc5
No known key found for this signature in database
3 changed files with 10 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/layout.tsx
View File

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

18
components/label.tsx
View File

@ -16,19 +16,17 @@ const Label = ({
}) => { }) => {
return ( return (
<div <div
className={clsx( className={clsx('absolute bottom-0 left-0 flex w-full px-4 pb-4', {
'absolute bottom-0 left-0 flex w-full', 'px-4 pb-4 md:px-8 md:pb-8 lg:px-20 lg:pb-[35%]': position === 'center',
position === 'center' 'px-4 pb-4 md:px-8 md:pb-8': size === 'large'
? 'px-4 pb-4 md:px-8 md:pb-8 lg:px-20 lg:pb-[35%]' })}
: size === 'large'
? 'px-4 pb-4 md:px-8 md:pb-8'
: 'px-4 pb-4'
)}
> >
<div <div
className={clsx( className={clsx(
'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', 'flex items-center rounded-full border bg-white/80 p-1 text-xs text-black backdrop-blur-md dark:border-gray-800 dark:bg-black/80 dark:text-white',
size === 'large' ? 'text-sm' : 'text-xs' {
'text-sm': size === 'large'
}
)} )}
> >
<h3 <h3

3
components/product/gallery.tsx
View File

@ -1,7 +1,6 @@
'use client'; 'use client';
import { ArrowLeftIcon, ArrowRightIcon } from '@heroicons/react/24/outline'; import { ArrowLeftIcon, ArrowRightIcon } from '@heroicons/react/24/outline';
import clsx from 'clsx';
import { GridTileImage } from 'components/grid/tile'; import { GridTileImage } from 'components/grid/tile';
import Image from 'next/image'; import Image from 'next/image';
import { useState } from 'react'; import { useState } from 'react';
@ -64,7 +63,7 @@ export function Gallery({ images }: { images: { src: string; altText: string }[]
<button <button
aria-label="Enlarge product image" aria-label="Enlarge product image"
key={image.src} key={image.src}
className={clsx('h-auto w-20')} className="h-auto w-20"
onClick={() => setCurrentImage(index)} onClick={() => setCurrentImage(index)}
> >
<GridTileImage <GridTileImage