Update list-form.tsx

Author: jnsdls

apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/(marketplace)/components/list-form.tsx

@@ -1,6 +1,7 @@
 import { Alert, AlertTitle } from "@/components/ui/alert";
 import { Button } from "@/components/ui/button";
 import { Card } from "@/components/ui/card";
+import { cn } from "@/lib/utils";
 import { useDashboardOwnedNFTs } from "@3rdweb-sdk/react/hooks/useDashboardOwnedNFTs";
 import { useWalletNFTs } from "@3rdweb-sdk/react/hooks/useWalletNFTs";
 import {
@@ -540,7 +541,7 @@ export const CreateListingsForm: React.FC<CreateListingsFormProps> = ({
                     >
                       <div
                         className={cn(
-                          "rounded-lg overflow-hidden cursor-pointer",
+                          "cursor-pointer overflow-hidden rounded-lg",
                           isSelected(nft) &&
                             "outline outline-3 outline-purple-500",
                         )}
@@ -549,6 +550,17 @@ export const CreateListingsForm: React.FC<CreateListingsFormProps> = ({
                             ? form.setValue("selected", undefined)
                             : form.setValue("selected", nft)
                         }
+                        onKeyDown={(e) => {
+                          if (e.key === "Enter" || e.key === " ") {
+                            e.preventDefault();
+                            isSelected(nft)
+                              ? form.setValue("selected", undefined)
+                              : form.setValue("selected", nft);
+                          }
+                        }}
+                        tabIndex={0}
+                        role="button"
+                        aria-pressed={isSelected(nft)}
                       >
                         <NFTMediaWithEmptyState
                           metadata={nft.metadata}

apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/_components/claim-conditions/claim-conditions-form/Inputs/ClaimPriceInput.tsx

@@ -1,3 +1,4 @@
+import { cn } from "@/lib/utils";
 import { Flex } from "@chakra-ui/react";
 import { CurrencySelector } from "components/shared/CurrencySelector";
 import { NATIVE_TOKEN_ADDRESS } from "thirdweb";
@@ -36,7 +37,7 @@ export const ClaimPriceInput = (props: {
       }
     >
       <Flex gap={2} flexDir={{ base: "column", md: "row" }}>
-        <div className="min-w-[70px] w-full md:w-1/2">
+        <div className="w-full min-w-[70px] md:w-1/2">
           <PriceInput
             w="full"
             value={field.price?.toString() || ""}

apps/dashboard/src/tw-components/card.tsx

@@ -26,7 +26,7 @@ export const Card: React.FC<CardProps> = ({
         style={{ padding: outlineBorder.width }}
       >
         <div
-          className="absolute inset-0 -z-10"
+          className="-z-10 absolute inset-0"
           style={{ background: outlineBorder.gradient }}
         />
         <div className={baseClasses} {...props}>