summaryrefslogtreecommitdiff
path: root/src-migrate/modules/product-detail/components/ProductComparisonModal.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src-migrate/modules/product-detail/components/ProductComparisonModal.tsx')
-rw-r--r--src-migrate/modules/product-detail/components/ProductComparisonModal.tsx29
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)}