Merge pull request QuickSwap#1736 from QuickSwap/hotfix/fix-ui-padding-farms-analytics

Fix padding issues on some pages and a mobile UI issue

Author: sameepsi

src/components/v3/RemoveLiquidityV3/index.scss

@@ -40,5 +40,11 @@
     height: 24px;
     border-radius: 10px;
     margin-left: 8px;
+    min-width: 0;
+
+    @include media('screen', '<phone') {
+      padding: 5px;
+      font-size: 12px;
+    }
   }
 }

src/index.scss

@@ -213,7 +213,7 @@ wcm-modal {
   align-items: center;
   flex-direction: column;
   margin: 0 auto;
-  padding: 152px 0;
+  padding: 152px 24px 0;
   @include media('screen', '<tablet') {
     padding: 190px 12px 0;
   }

src/pages/PoolsPage/PoolsPage.tsx

@@ -78,7 +78,7 @@ const PoolsPage: React.FC = () => {
   }, [showPools]);
 
   return (
-    <Box mb={3} className='pageContainer' width='100%'>
+    <Box mb={3} width='100%'>
       {isMobile ? (
         <>
           <Box mt={2} mb={2} className='pageHeading items-center'>

src/pages/styles/pools.scss

@@ -62,13 +62,6 @@
   }
 }
 
-.pageContainer {
-  padding: 24px;
-  @include media('screen', '<phone') {
-    padding: 12px;
-  }
-}
-
 .selectDepositContainer {
   gap: 16px;
   @include media('screen', '<phone') {