cleanup

Author: pettinarip

src/components/HorizontalCard.tsx

@@ -23,11 +23,11 @@ const HorizontalCard = ({
   ...props
 }: HorizontalCardProps) => {
   return (
-    <div className={cn("my-2 flex items-start gap-8", className)} {...props}>
+    <div className={cn("flex items-center gap-8", className)} {...props}>
       <Emoji text={emoji} className={cn("text-5xl", emojiClassName)} />
       <div className="flex-shrink flex-grow-0 basis-3/4 space-y-2">
         <p className="text-lg">{title}</p>
-        <p className="text-base">{description}</p>
+        <p>{description}</p>
         {children}
       </div>
     </div>

src/data/wallets/wallet-data.ts

@@ -13,8 +13,8 @@ import BridgeWalletImage from "@/public/images/wallets/bridge.png"
 import ClearWallet from "@/public/images/wallets/clearwallet.png"
 import CoinbaseImage from "@/public/images/wallets/coinbase.png"
 import CoinWalletImage from "@/public/images/wallets/coinwallet.png"
-import CypherockX1Image from "@/public/images/wallets/cypherockx1.png"
 import CtrlWalletImage from "@/public/images/wallets/ctrl.png"
+import CypherockX1Image from "@/public/images/wallets/cypherockx1.png"
 import EnkryptImage from "@/public/images/wallets/enkrypt.png"
 import ExodusImage from "@/public/images/wallets/exodus.png"
 import FoxWalletImage from "@/public/images/wallets/foxwallet.png"
@@ -1546,7 +1546,20 @@ export const walletsData: WalletData[] = [
     twGradiantBrandColor: "from-[#ffffff]",
     url: "https://web3.bitget.com/",
     active_development_team: true,
-    languages_supported: ["en", "zh","zh-tw", "ko", "ja", "vi", "tr", "es", "id", "hi", "ar", "pt"],
+    languages_supported: [
+      "en",
+      "zh",
+      "zh-tw",
+      "ko",
+      "ja",
+      "vi",
+      "tr",
+      "es",
+      "id",
+      "hi",
+      "ar",
+      "pt",
+    ],
     twitter: "https://twitter.com/BitgetWallet",
     discord: "https://discord.gg/bitget-wallet",
     reddit: "",
@@ -2140,8 +2153,8 @@ export const walletsData: WalletData[] = [
     social_recovery: false,
     onboard_documentation: "https://www.cypherock.com",
     documentation: "https://github.com/Cypherock/x1_wallet_firmware",
-   },
-   {
+  },
+  {
     last_updated: "2024-10-31",
     name: "Clear Wallet",
     image: ClearWallet,
@@ -2177,7 +2190,7 @@ export const walletsData: WalletData[] = [
     layer_2: true,
     gas_fee_customization: true,
     ens_support: false,
-    erc_20_support: true,        
+    erc_20_support: true,
     buy_crypto: false,
     withdraw_crypto: false,
     multisig: false,

src/pages/eth.tsx

@@ -215,6 +215,7 @@ const CardContainer = (props: FlexProps) => (
 const TokenCard = (props: ComponentProps<typeof HorizontalCard>) => (
   <HorizontalCard
     className={cn("mx-0 my-2 min-w-full rounded-none", props.className)}
+    emojiClassName="text-[5rem]"
     {...props}
   />
 )
@@ -557,7 +558,6 @@ const EthPage = () => {
               emoji={token.emoji}
               title={token.title}
               description={token.description}
-              className="text-[5rem]"
             />
           ))}
         </RightColumn>

src/pages/gas.tsx

@@ -298,7 +298,6 @@ const GasPage = () => {
                   key={benefit.emoji}
                   emoji={benefit.emoji}
                   description={benefit.description}
-                  className="flex items-center"
                 />
               </Box>
             ))}

src/pages/stablecoins.tsx

@@ -456,7 +456,12 @@ const StablecoinsPage = ({ markets, marketsHasError }) => {
           me={{ base: 0, lg: 8 }}
           mb={8}
         >
-          <Box w="full" margin={{ base: "auto 0", lg: "0 2rem 0" }}>
+          <Flex
+            w="full"
+            margin={{ base: "auto 0", lg: "0 2rem 0" }}
+            direction="column"
+            gap={2}
+          >
             {tokens.map((token, index) => (
               <Box key={index} minWidth="full" my={2}>
                 <HorizontalCard
@@ -465,7 +470,7 @@ const StablecoinsPage = ({ markets, marketsHasError }) => {
                 />
               </Box>
             ))}
-          </Box>
+          </Flex>
           <GhostCard className="me-0 mt-16 max-w-[640px] lg:me-8 lg:mt-2">
             <Emoji text=":pizza:" className="text-5xl" />
             <H3>{t("page-stablecoins-bitcoin-pizza")}</H3>

src/pages/wallets/index.tsx

@@ -118,7 +118,7 @@ export const StyledCard = (props: ComponentPropsWithRef<typeof Card>) => (
 const ChecklistItem = (props: HorizontalCardProps) => (
   <HorizontalCard
     emojiClassName="text-2xl"
-    className="flex-start mb-4 flex border-0"
+    className="items-start"
     {...props}
   />
 )
@@ -356,13 +356,13 @@ const WalletsPage = () => {
         <RightColumn mt={{ base: 12, lg: 0 }}>
           <H2>{t("page-wallets-types")}</H2>
           <Text>{t("page-wallets-types-desc")}</Text>
-          <Box>
+          <Box className="flex flex-col gap-2">
             {types.map((type, idx) => (
               <HorizontalCard
                 key={idx}
                 emoji={type.emoji}
                 description={type.description}
-                className="my-0.5 w-[100%] items-center"
+                className="my-0.5 w-[100%]"
                 emojiClassName="text-[2.5rem]"
               />
             ))}
@@ -439,7 +439,7 @@ const WalletsPage = () => {
           <Box lineHeight={1.4} mb={6} color="text300">
             <Translation id="page-wallets:page-wallets-stay-safe-desc" />
           </Box>
-          <Box>
+          <Flex direction="column" gap={4}>
             <ChecklistItem
               key="0"
               emoji=":white_check_mark:"
@@ -472,7 +472,7 @@ const WalletsPage = () => {
               title={t("page-wallets-triple-check")}
               description={t("page-wallets-triple-check-desc")}
             />
-          </Box>
+          </Flex>
         </LeftColumn>
         <RightColumn mt={{ base: 12, lg: 0 }}>
           <H2>{t("page-wallets-tips")}</H2>