diff options
Diffstat (limited to 'src-migrate/modules/product-detail/components/ProductComparisonModal.tsx')
| -rw-r--r-- | src-migrate/modules/product-detail/components/ProductComparisonModal.tsx | 29 |
1 files changed, 24 insertions, 5 deletions
diff --git a/src-migrate/modules/product-detail/components/ProductComparisonModal.tsx b/src-migrate/modules/product-detail/components/ProductComparisonModal.tsx index b5676ac8..5dd3f175 100644 --- a/src-migrate/modules/product-detail/components/ProductComparisonModal.tsx +++ b/src-migrate/modules/product-detail/components/ProductComparisonModal.tsx @@ -523,9 +523,11 @@ const ProductComparisonModal = ({ isOpen, onClose, mainProduct, selectedVariant <InputGroup size="sm"> <AutoCompleteInput variant="outline" - // fontSize="xs" - fontSize={{ base: '16px', md: 'sm' }} // fix font size mobile - borderRadius="md" + fontSize="sm" + _focus={{ + fontSize: {base: '16px', md: 'sm'}, + borderColor: 'red.500', + }}borderRadius="md" placeholder="Cari Varian..." value={product.inputValue} onChange={(e) => handleInputChange(index, e.target.value)} @@ -640,8 +642,25 @@ const ProductComparisonModal = ({ isOpen, onClose, mainProduct, selectedVariant <InputGroup size="sm"> <InputLeftElement pointerEvents="none"><Icon as={Search} color="gray.300" /></InputLeftElement> <Input - placeholder="Cari Produk..." borderRadius="md" - fontSize={{ base: '16px', md: 'sm' }} // fix font size mobile + placeholder="Cari Produk..." + borderRadius="md" + fontSize="16px" + sx={{ + base: { + transform: "scale(0.875)", // Kecilkan visual jadi setara 14px (sm) + transformOrigin: "left center", + width: "114.29%", // Kompensasi lebar + marginBottom: "-2px", + marginRight: "-14.29%" + }, + md: { + fontSize: "sm", // Di Desktop pakai ukuran asli (14px) + transform: "none", + width: "100%", + marginBottom: "0", + marginRight: "0" + } + }} value={activeSearchSlot === index ? searchQuery : ''} onFocus={() => { setActiveSearchSlot(index); setSearchQuery(''); }} onChange={(e) => setSearchQuery(e.target.value)} |
