improvement(remove liquidity): fix width of buttons on small screens

src/components/Modal/index.tsx

@@ -112,17 +112,10 @@ export default function Modal({
   const [{ y }, set] = useSpring(() => ({ y: 0, config: { mass: 1, tension: 210, friction: 20 } }))
   const bind = useGesture({
     onDrag: state => {
-      let velocity = state.velocity
-      if (velocity < 1) {
-        velocity = 1
-      }
-      if (velocity > 8) {
-        velocity = 8
-      }
       set({
         y: state.down ? state.movement[1] : 0
       })
-      if (velocity > 3 && state.direction[1] > 0) {
+      if (state.velocity > 3 && state.direction[1] > 0) {
         onDismiss()
       }
     }

src/pages/Pool/styleds.tsx

@@ -17,9 +17,13 @@ export const MaxButton = styled.button<{ width: string }>`
   border: 1px solid ${({ theme }) => theme.primary5};
   border-radius: 0.5rem;
   font-size: 1rem;
+  ${({ theme }) => theme.mediaWidth.upToSmall`
+    padding: 0.25rem 0.5rem;
+  `};
   font-weight: 500;
   cursor: pointer;
-  margin-right: 0.5rem;
+  margin: 0.25rem;
+  overflow: hidden;
   color: ${({ theme }) => theme.primary1};
   :hover {
     border: 1px solid ${({ theme }) => theme.primary1};