Merge pull request #2192 from iFixit/fix-ios-safari-select-overflow-bug

Fix ios safari select overflow bug
iFixit · Jan 9, 2024 · 2d21c67 · 2d21c67 · vercel · Jan 9, 2024
2 parents ac1aefd + 287aa4a
commit 2d21c67
Showing 1 changed file with 6 additions and 8 deletions.
diff --git a/frontend/templates/product/sections/ProductOverviewSection/ProductOptions.tsx b/frontend/templates/product/sections/ProductOverviewSection/ProductOptions.tsx
@@ -3,7 +3,6 @@ import {
    BoxProps,
    Circle,
    Flex,
-   HStack,
    Image,
    Select,
    SimpleGrid,
@@ -48,16 +47,15 @@ export function ProductOptions({
             const selectorType = getSelectorType(option);
             return (
                <VStack align="stretch" key={option.id}>
-                  <HStack>
-                     <Text fontWeight="medium" color="gray.800">
-                        {option.name}
-                        {selectorType === SelectorType.SINGLE &&
-                           `: ${option.values[0]}`}
-                     </Text>
-                  </HStack>
+                  <Text fontWeight="medium" color="gray.800">
+                     {option.name}
+                     {selectorType === SelectorType.SINGLE &&
+                        `: ${option.values[0]}`}
+                  </Text>
                   {selectorType === SelectorType.SELECT && (
                      <Select
                         bg="white"
+                        overflowX="hidden"
                         value={selected}
                         onChange={(event) => {
                            onChange(event.target.value);