fix: adjusting slippage in a different language (#7073)

* fix: adjusting slippage in a different language

* making overflow hidden on close

* passing width instead of visibility

* min width

src/components/AnimatedDropdown/index.tsx

@@ -22,7 +22,9 @@ export default function AnimatedDropdown({ open, children }: React.PropsWithChil
     },
   })
   return (
-    <animated.div style={{ ...props, overflow: 'hidden', width: '100%', willChange: 'height' }}>
+    <animated.div
+      style={{ ...props, overflow: 'hidden', width: '100%', minWidth: 'min-content', willChange: 'height' }}
+    >
       <div ref={ref}>{children}</div>
     </animated.div>
   )

src/components/Settings/Input/index.tsx

@@ -24,6 +24,7 @@ export const InputContainer = styled(Row)<{ error?: boolean }>`
   padding: 8px 16px;
   border-radius: 12px;
   width: auto;
+  min-width: 100px;
   flex: 1;
   input {
     color: ${({ theme, error }) => (error ? theme.accentFailure : theme.textPrimary)};

src/components/swap/__snapshots__/SwapDetailsDropdown.test.tsx.snap

@@ -266,7 +266,7 @@ exports[`SwapDetailsDropdown.tsx renders a trade 1`] = `
       </div>
     </div>
     <div
-      style="height: 0px; overflow: hidden; width: 100%; will-change: height;"
+      style="height: 0px; overflow: hidden; width: 100%; min-width: min-content; will-change: height;"
     >
       <div>
         <div