feat: wrap Overview component in XStack for improved layout

Author: Charon-Fan

packages/kit/src/views/Earn/EarnHome.tsx

@@ -6,6 +6,7 @@ import {
   Page,
   RefreshControl,
   Stack,
+  XStack,
   YStack,
   useMedia,
 } from '@onekeyhq/components';
@@ -299,7 +300,9 @@ function BasicEarnHome({
       <YStack flex={1} gap="$4">
         {/* overview and banner */}
         <YStack gap="$8">
-          <Overview onRefresh={refreshEarnAccounts} isLoading={isLoading} />
+          <XStack px="$5">
+            <Overview onRefresh={refreshEarnAccounts} isLoading={isLoading} />
+          </XStack>
           {banners ? (
             <YStack
               minHeight="$36"

packages/kit/src/views/Earn/components/Overview.tsx

@@ -319,9 +319,6 @@ export const Overview = ({
     <YStack
       gap="$1"
       px="$0"
-      $gtSm={{
-        px: '$5',
-      }}
       $gtLg={{
         flexDirection: 'row',
         alignItems: 'center',