Revert "feat: kado integration and updated wallet buttons"

This reverts commit 3b6cf86.

src/app/sections/Nav.tsx

@@ -57,7 +57,10 @@ const useCloseMenuOnNavigate = () => {
   const setIsWalletOpen = useSetRecoilState(isWalletBarOpen)
 
   useEffect(() => {
-    if (isOpen) setIsWalletOpen(false) // close wallet menu on mobile
+    if (isOpen) {
+      // close wallet menu on mobile
+      setIsWalletOpen(false)
+    }
     setIsOpen(false)
   }, [pathname, setIsOpen, setIsWalletOpen]) // eslint-disable-line react-hooks/exhaustive-deps
 }

src/pages/wallet/FiatRampModal.tsx

@@ -2,7 +2,6 @@ import { FIAT_RAMP, KADO_API_KEY } from "config/constants"
 import { useAddress } from "data/wallet"
 import { useState } from "react"
 import { LoadingCircular } from "components/feedback"
-import styles from "./FiatRampModal.module.scss"
 
 const FiatRampModal = () => {
   const address = useAddress()
@@ -12,26 +11,23 @@ const FiatRampModal = () => {
     network: "Terra",
     onToAddress: address || "",
     apiKey: KADO_API_KEY,
-    product: "BUY",
-    onRevCurrency: "USDC",
   }
 
   const kadoUrlParams = new URLSearchParams(rampParams).toString()
 
   return (
-    <div className={styles.container}>
-      {isLoading && (
-        <div className={styles.loading}>
-          <LoadingCircular size={36} thickness={2} />
-        </div>
-      )}
-      <iframe
-        className={styles.iframe}
-        src={`${FIAT_RAMP}?${kadoUrlParams}`}
-        title="Kado Ramp"
-        onLoad={() => setIsLoading(false)}
-      />
-    </div>
+    <>
+      {isLoading && <LoadingCircular size={36} thickness={2} />}
+      {
+        <iframe
+          src={`${FIAT_RAMP}?${kadoUrlParams}`}
+          width="500"
+          height="686"
+          title="Kado Ramp"
+          onLoad={() => setIsLoading(false)}
+        />
+      }
+    </>
   )
 }
 

src/pages/wallet/NetWorth.module.scss

@@ -1,53 +1,32 @@
-@import "mixins";
-
 .networth {
-  @include flex-column;
   padding: 1.6rem;
   border-bottom: var(--border-width) solid var(--card-border);
 
   p {
     color: var(--text-muted);
-    font-size: 14px;
-    line-height: 140%;
   }
 
   h1 {
-    font-size: 32px;
-    line-height: 150%;
-    margin-top: 4px;
+    font-weight: 600;
+    font-size: 22pt;
   }
 
   grid-area: details;
   height: fit-content;
   background-color: var(--card-bg);
 }
+
 .networth__buttons {
-  @include flex(space-around);
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 10px;
   margin-top: 20px;
-  width: 100%;
-
-  .button__wrapper {
-    @include flex-column;
-    gap: 8px;
-  }
 
   button {
     min-width: 0;
-    border-radius: 50%;
-    width: 60px;
-    height: 60px;
-    padding: 16px;
-    @include flex;
-  }
-}
-
-.icon {
-  font-size: 24px;
-
-  &.send {
-    transform: rotate(-90deg);
-  }
-  &.receive {
-    transform: rotate(90deg);
+    width: 100%;
+    padding-block: 20px;
+    height: fit-content;
   }
 }

src/pages/wallet/NetWorth.tsx

@@ -10,12 +10,6 @@ import styles from "./NetWorth.module.scss"
 import { useWalletRoute, Path } from "./Wallet"
 import { capitalize } from "@mui/material"
 import NetWorthTooltip from "./NetWorthTooltip"
-import { ModalButton } from "components/feedback"
-import FiatRampModal from "./FiatRampModal"
-import { Add as AddIcon, Send as SendIcon } from "@mui/icons-material"
-import classNames from "classnames"
-
-const cx = classNames.bind(styles)
 
 const NetWorth = () => {
   const { t } = useTranslation()
@@ -46,46 +40,27 @@ const NetWorth = () => {
         <Read amount={coinsValue} decimals={0} fixed={2} denom="" token="" />
       </h1>
       <div className={styles.networth__buttons}>
-        <div className={styles.button__wrapper}>
-          <Button
-            color="primary"
-            onClick={() =>
-              setRoute({
-                path: Path.send,
-                previousPage: route,
-              })
-            }
-          >
-            <SendIcon className={cx(styles.icon, styles.send)} />
-          </Button>
-          <h3>{capitalize(t("send"))}</h3>
-        </div>
-        <div className={styles.button__wrapper}>
-          <Button
-            onClick={() =>
-              setRoute({
-                path: Path.receive,
-                previousPage: route,
-              })
-            }
-          >
-            <SendIcon className={cx(styles.icon, styles.receive)} />
-          </Button>
-          <h3>{capitalize(t("receive"))}</h3>
-        </div>
-        <div className={styles.button__wrapper}>
-          <ModalButton
-            minimal
-            renderButton={(open) => (
-              <Button onClick={open}>
-                <AddIcon className={styles.icon} />
-              </Button>
-            )}
-          >
-            <FiatRampModal />
-          </ModalButton>
-          <h2>{t(capitalize("buy"))}</h2>
-        </div>
+        <Button
+          color="primary"
+          onClick={() =>
+            setRoute({
+              path: Path.send,
+              previousPage: route,
+            })
+          }
+        >
+          {capitalize(t("Send"))}
+        </Button>
+        <Button
+          onClick={() =>
+            setRoute({
+              path: Path.receive,
+              previousPage: route,
+            })
+          }
+        >
+          {capitalize(t("receive"))}
+        </Button>
       </div>
     </article>
   )