diff --git a/app/components/seller/InlinePriceEditor.tsx b/app/components/seller/InlinePriceEditor.tsx index ed47206..682ea55 100644 --- a/app/components/seller/InlinePriceEditor.tsx +++ b/app/components/seller/InlinePriceEditor.tsx @@ -194,9 +194,13 @@ export function InlinePriceEditor({ onClick={openEditor} disabled={isPending} aria-label={ariaLabel} + // Looks like an editable field (subtle border + grey fill) with an + // always-visible pencil, so it reads as tappable on touch devices where + // there is no hover to reveal the affordance. className={cn( - "group inline-flex items-center gap-1.5 rounded-lg px-2 py-1.5 min-h-[36px]", - "transition-colors hover:bg-VITROWN_BLUE/5 cursor-pointer disabled:cursor-default", + "group inline-flex items-center gap-1.5 rounded-lg border border-GRAY3 bg-WHITE3 px-2.5 py-1.5 min-h-[36px]", + "transition-colors hover:border-VITROWN_BLUE hover:bg-VITROWN_BLUE/5 active:bg-VITROWN_BLUE/10", + "cursor-pointer disabled:cursor-default disabled:opacity-70", alignClass, className )} @@ -204,7 +208,7 @@ export function InlinePriceEditor({ {isPending ? ( ) : ( - + )} {hasValue ? ( diff --git a/app/routes/store.$storeId.products.tsx b/app/routes/store.$storeId.products.tsx index 762af89..b104daa 100644 --- a/app/routes/store.$storeId.products.tsx +++ b/app/routes/store.$storeId.products.tsx @@ -104,7 +104,6 @@ function ProductAccordionItem({ size="sm" align="start" ariaLabel="ویرایش قیمت محصول" - className="-mr-2" /> @@ -221,7 +220,6 @@ function ProductAccordionItem({ size="sm" align="start" ariaLabel="ویرایش قیمت این تنوع" - className="-mr-2" />