update menu

mybucks-online · Dec 26, 2024 · 78a5739 · 78a5739
1 parent 4bbba61
commit 78a5739
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 19 deletions.
diff --git a/src/assets/icons/cog.svg b/src/assets/icons/cog.svg
diff --git a/src/pages/network/evm/Home.jsx b/src/pages/network/evm/Home.jsx
@@ -5,7 +5,7 @@ import { ethers } from "ethers";
 import styled from "styled-components";
 import toFlexible from "toflexible";
 
-import ArrowUpIcon from "@mybucks/assets/icons/arrow-up.svg";
+import CogIcon from "@mybucks/assets/icons/cog.svg";
 import CopyIcon from "@mybucks/assets/icons/copy.svg";
 import GasIcon from "@mybucks/assets/icons/gas.svg";
 import HideIcon from "@mybucks/assets/icons/hide.svg";
@@ -25,7 +25,7 @@ import media from "@mybucks/styles/media";
 const NetworkAndFeatures = styled.div`
   display: flex;
   align-items: center;
-  justify-content: space-between;
+  gap: 1rem;
   margin-bottom: ${({ theme }) => theme.sizes.x4l};
 
   ${media.md`
@@ -47,7 +47,6 @@ const GasPriceWrapper = styled.div`
   display: flex;
   align-items: center;
   gap: 6px;
-  width: 6rem;
   visibility: ${({ $show }) => ($show ? "visible" : "hidden")};
   font-weight: ${({ theme }) => theme.weights.regular};
   font-size: ${({ theme }) => theme.sizes.sm};
@@ -58,12 +57,7 @@ const MenuButton = styled(BaseButton).attrs({ $size: "small" })`
   align-items: center;
   gap: 8px;
   padding: 6px 8px;
-
-  ${media.sm`
-    span {
-      display: none;
-    }
-  `}
+  margin-left: auto;
 `;
 
 const CloseButton = styled(BaseButton).attrs({ $size: "small" })`
@@ -196,7 +190,7 @@ const EvmHome = () => {
         </NetworkWrapper>
 
         <MenuButton onClick={() => openMenu(true)}>
-          <img src={ArrowUpIcon} /> <span>Backup</span>
+          <img src={CogIcon} />
         </MenuButton>
 
         <CloseButton onClick={close}>

diff --git a/src/pages/network/tron/Home.jsx b/src/pages/network/tron/Home.jsx
@@ -4,7 +4,7 @@ import copy from "clipboard-copy";
 import styled from "styled-components";
 import toFlexible from "toflexible";
 
-import ArrowUpIcon from "@mybucks/assets/icons/arrow-up.svg";
+import CogIcon from "@mybucks/assets/icons/cog.svg";
 import CopyIcon from "@mybucks/assets/icons/copy.svg";
 import HideIcon from "@mybucks/assets/icons/hide.svg";
 import LockIcon from "@mybucks/assets/icons/lock.svg";
@@ -24,7 +24,7 @@ import media from "@mybucks/styles/media";
 const NetworkAndFeatures = styled.div`
   display: flex;
   align-items: center;
-  justify-content: space-between;
+  gap: 1rem;
   margin-bottom: ${({ theme }) => theme.sizes.x4l};
 
   ${media.md`
@@ -47,12 +47,7 @@ const MenuButton = styled(BaseButton).attrs({ $size: "small" })`
   align-items: center;
   gap: 8px;
   padding: 6px 8px;
-
-  ${media.sm`
-    span {
-      display: none;
-    }
-  `}
+  margin-left: auto;
 `;
 
 const CloseButton = styled(BaseButton).attrs({ $size: "small" })`
@@ -208,7 +203,7 @@ const TronHome = () => {
         </NetworkWrapper>
 
         <MenuButton onClick={() => openMenu(true)}>
-          <img src={ArrowUpIcon} /> <span>Backup</span>
+          <img src={CogIcon} />
         </MenuButton>
 
         <CloseButton onClick={close}>