Skip to content

Commit

Permalink
add wallet setting
Browse files Browse the repository at this point in the history
  • Loading branch information
@temptemp3
temptemp3 committed Nov 12, 2024
1 parent 57a0490 commit ba442c3
Showing 1 changed file with 39 additions and 19 deletions.
58 changes: 39 additions & 19 deletions src/components/ConnectWallet/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ import DarkModeIcon from "@mui/icons-material/DarkMode";
import LightModeIcon from "@mui/icons-material/LightMode";
import { useDispatch } from "react-redux";
import { toggleTheme } from "../../store/themeSlice";
import AccountBalanceWalletIcon from '@mui/icons-material/AccountBalanceWallet';

const AccountDropdown = styled.div`
/* Layout */
Expand Down Expand Up @@ -247,7 +248,7 @@ const ConnectButton = () => {
<rect x="3" y="2" width="153" height="44" rx="22" fill="#9933FF" />
<rect x="3" y="2" width="153" height="44" rx="22" stroke="#9933FF" />
<path
d="M25.976 22.28C25.976 24.724 27.072 26.072 28.992 26.072C30.524 26.072 31.464 25.172 31.768 23.4H34.28C33.848 26.412 31.856 28.24 28.988 28.24C25.728 28.24 23.432 25.872 23.432 22.28C23.432 18.688 25.728 16.32 28.988 16.32C31.856 16.32 33.848 18.148 34.28 21.16H31.768C31.464 19.384 30.524 18.488 28.992 18.488C27.072 18.488 25.976 19.836 25.976 22.28ZM35.0624 23.588C35.0624 20.772 36.8984 18.94 39.5344 18.94C42.1704 18.94 44.0064 20.772 44.0064 23.588C44.0064 26.404 42.1704 28.24 39.5344 28.24C36.8984 28.24 35.0624 26.404 35.0624 23.588ZM37.4744 23.588C37.4744 25.22 38.2384 26.152 39.5344 26.152C40.8344 26.152 41.5944 25.224 41.5944 23.588C41.5944 21.952 40.8344 21.028 39.5344 21.028C38.2384 21.028 37.4744 21.956 37.4744 23.588ZM47.2361 23.372V28H44.8401V19.18H47.2361V21.832C47.6081 19.964 48.7001 18.94 50.3361 18.94C52.2361 18.94 53.2641 20.328 53.2641 22.876V28H50.8681V23.276C50.8681 21.772 50.3041 21.028 49.1561 21.028C47.9321 21.028 47.2361 21.856 47.2361 23.372ZM56.6424 23.372V28H54.2464V19.18H56.6424V21.832C57.0144 19.964 58.1064 18.94 59.7424 18.94C61.6424 18.94 62.6704 20.328 62.6704 22.876V28H60.2744V23.276C60.2744 21.772 59.7104 21.028 58.5624 21.028C57.3384 21.028 56.6424 21.856 56.6424 23.372ZM69.9046 25.012H72.1566C71.6766 27.02 70.0686 28.24 67.9246 28.24C65.2646 28.24 63.4686 26.36 63.4686 23.58C63.4686 20.808 65.2446 18.94 67.8766 18.94C70.4846 18.94 72.1966 20.772 72.1966 23.568C72.1966 23.78 72.1886 23.996 72.1646 24.22H65.7806C65.9366 25.54 66.7446 26.324 67.9926 26.324C68.9246 26.324 69.5566 25.884 69.9046 25.012ZM65.8086 22.74H69.8966C69.6966 21.48 69.0086 20.824 67.8886 20.824C66.7406 20.824 66.0006 21.52 65.8086 22.74ZM75.2713 23.588C75.2713 25.22 76.0353 26.152 77.3353 26.152C78.4273 26.152 78.9953 25.472 79.1753 24.516H81.5673C81.2913 26.7 79.6913 28.24 77.3313 28.24C74.6953 28.24 72.8593 26.404 72.8593 23.588C72.8593 20.772 74.6953 18.94 77.3313 18.94C79.6913 18.94 81.2913 20.48 81.5673 22.664H79.1793C78.9953 21.704 78.4273 21.028 77.3353 21.028C76.0353 21.028 75.2713 21.956 75.2713 23.588ZM88.0405 27.932C87.2965 28.136 86.6405 28.236 86.0645 28.236C84.1245 28.236 83.1085 27.088 83.1085 24.844V21.084H82.0045V19.18H83.1085V17.148H85.5045V19.18H88.0405V21.084H85.5045V24.848C85.5045 25.86 85.8605 26.308 86.6765 26.308C87.0045 26.308 87.4405 26.236 88.0405 26.084V27.932Z"
d="M25.976 22.28C25.976 24.724 27.072 26.072 28.992 26.072C30.524 26.072 31.464 25.172 31.768 23.4H34.28C33.848 26.412 31.856 28.24 28.988 28.24C25.728 28.24 23.432 25.872 23.432 22.28C23.432 18.688 25.728 16.32 28.988 16.32C31.856 16.32 33.848 18.148 34.28 21.16H31.768C31.464 19.384 30.524 18.488 28.992 18.488C27.072 18.488 25.976 19.836 25.976 22.28ZM35.0624 23.588C35.0624 20.772 36.8984 18.94 39.5344 18.94C42.1704 18.94 44.0064 20.772 44.0064 23.588C44.0064 26.404 42.1704 28.24 39.5344 28.24C36.8984 28.24 35.0624 26.404 35.0624 23.588ZM37.4744 23.588C37.4744 25.22 38.2384 26.152 39.5344 26.152C40.8344 26.152 41.5944 25.224 41.5944 23.588C41.5944 21.952 40.8344 21.028 39.5344 21.028C38.2384 21.028 37.4744 21.956 37.4744 23.588ZM47.2361 23.372V28H44.8401V19.18H47.2361V21.832C47.6081 19.964 48.7001 18.94 50.3361 18.94C52.2361 18.94 53.2641 20.328 53.2641 22.876V28H50.8681V23.276C50.8681 21.772 50.3041 21.028 49.1561 21.028C47.9321 21.028 47.2361 21.856 47.2361 23.372ZM56.6424 23.372V28H54.2464V19.18H56.6424V21.832C57.0144 19.964 58.1064 18.94 59.7424 18.94C61.6424 18.94 62.6704 20.328 62.6704 22.876V28H60.2744V23.276C60.2744 21.772 59.7104 21.028 58.5624 21.028C57.3384 21.028 56.6424 21.856 56.6424 23.372ZM69.9046 25.012H72.1566C71.6766 27.02 70.0686 28.24 67.9246 28.24C65.2646 28.24 63.4686 26.36 63.4686 23.58C63.4686 20.808 65.2446 18.94 67.8766 18.94C70.4846 18.94 72.1966 20.772 72.1966 23.568C72.1966 23.78 72.1886 23.996 72.1646 24.22H65.7806C65.9366 25.54 66.7446 26.324 67.9926 26.324C68.9246 26.324 69.5566 25.884 69.9046 25.012ZM65.8086 22.74H69.8966C69.6966 21.48 69.0086 20.824 67.8886 20.824C66.7406 20.824 66.0006 21.52 65.8086 22.74ZM75.2713 23.588C75.2713 25.22 76.0353 26.152 77.3353 26.152C78.4273 26.152 78.9953 25.472 79.1753 24.516H81.5673C81.2913 26.7 79.6913 28.24 77.3313 28.24C74.6953 28.24 72.8593 26.404 72.8593 23.588C72.8593 20.772 74.6953 18.94 77.3313 18.94C79.6913 18.94 81.2913 20.48 81.5673 22.664H79.1793C78.9953 21.704 78.4273 21.028 77.3353 21.028C76.0353 21.028 75.2713 21.956 75.2713 23.588ZM88.0405 27.932C87.2965 28.136 86.6405 28.236 86.0645 28.236C84.1245 28.236 83.1085 27.088 83.1085 24.844V21.084H82.0045V19.18H83.1085V17.148H85.5045V19.18H101.291V21.084H98.7545V24.848C98.7545 25.86 99.1105 26.308 99.9265 26.308C100.092 26.308 100.285 26.2907 100.507 26.256C100.728 26.2187 100.989 26.1613 101.291 26.084V27.932Z"
fill="white"
/>
<rect x="118" y="8" width="32" height="32" rx="16" fill="#99FF33" />
Expand Down Expand Up @@ -774,26 +775,45 @@ function BasicMenu() {
{showSettings && (
<SettingsMenu
$isDarkTheme={isDarkTheme}
className="settings-menu" // Add this class for click outside handling
onClick={(e) => e.stopPropagation()} // Prevent clicks from closing drawer
className="settings-menu"
onClick={(e) => e.stopPropagation()}
>
<SettingsMenuItem
$isDarkTheme={isDarkTheme}
onClick={handleThemeToggle}
>
<SettingsLabel $isDarkTheme={isDarkTheme}>
Theme
</SettingsLabel>
{isDarkTheme ? (
<DarkModeIcon
sx={{ fontSize: 20, color: "#FFBE1D" }}
/>
) : (
<LightModeIcon
sx={{ fontSize: 20, color: "#9933FF" }}
<>
<SettingsMenuItem
$isDarkTheme={isDarkTheme}
onClick={handleThemeToggle}
>
<SettingsLabel $isDarkTheme={isDarkTheme}>
Theme
</SettingsLabel>
{isDarkTheme ? (
<DarkModeIcon
sx={{ fontSize: 20, color: "#FFBE1D" }}
/>
) : (
<LightModeIcon
sx={{ fontSize: 20, color: "#9933FF" }}
/>
)}
</SettingsMenuItem>
<SettingsMenuItem
$isDarkTheme={isDarkTheme}
onClick={() => {
setIsWalletModalOpen(true);
setShowSettings(false);
}}
>
<SettingsLabel $isDarkTheme={isDarkTheme}>
Wallet Connect
</SettingsLabel>
<AccountBalanceWalletIcon
sx={{
fontSize: 20,
color: isDarkTheme ? "#FFBE1D" : "#9933FF"
}}
/>
)}
</SettingsMenuItem>
</SettingsMenuItem>
</>
</SettingsMenu>
)}
</div>
Expand Down

0 comments on commit ba442c3

Please sign in to comment.