diff --git a/apps/web/src/components/Header/Header.tsx b/apps/web/src/components/Header/Header.tsx
index 9642378041..1fffe42d1f 100644
--- a/apps/web/src/components/Header/Header.tsx
+++ b/apps/web/src/components/Header/Header.tsx
@@ -1,18 +1,16 @@
-import { Card, Icon, SlideFade, useBreakpointValue, useColorMode } from "@chakra-ui/react";
-import { mode } from "@chakra-ui/theme-tools";
+import { Card, Icon, SlideFade, useBreakpointValue } from "@chakra-ui/react";
import { useDynamicModalContext } from "@umami/components";
import { useCurrentAccount } from "@umami/state";
import { useEffect, useState } from "react";
import { Actions } from "./Actions";
-import { LogoDarkIcon, LogoLightIcon } from "../../assets/icons";
+import { LogoLightIcon } from "../../assets/icons";
import { useColor } from "../../styles/useColor";
import { AccountSelectorModal } from "../AccountSelectorModal";
import { AccountTile } from "../AccountTile";
export const Header = () => {
const color = useColor();
- const colorMode = useColorMode();
const currentAccount = useCurrentAccount()!;
const { openWith } = useDynamicModalContext();
@@ -59,7 +57,7 @@ export const Header = () => {
md: "2px 4px 12px 0px rgba(45, 55, 72, 0.05)",
}}
>
- {mode(, )(colorMode)}
+
-
+
{title && (
{title}
diff --git a/apps/web/src/components/Menu/MenuItem.tsx b/apps/web/src/components/Menu/MenuItem.tsx
index 46d2bbb102..a7e1170df4 100644
--- a/apps/web/src/components/Menu/MenuItem.tsx
+++ b/apps/web/src/components/Menu/MenuItem.tsx
@@ -17,7 +17,7 @@ export const MenuItem = ({ label, icon, onClick, rightElement, hasArrow }: TMenu
color={color("400")}
data-group
onClick={onClick}
- variant="ghost"
+ variant="dropdownOption"
>
{icon}
diff --git a/apps/web/src/components/Onboarding/ImportWallet/ImportBackupTab.tsx b/apps/web/src/components/Onboarding/ImportWallet/ImportBackupTab.tsx
index 144025b002..a927541a6c 100644
--- a/apps/web/src/components/Onboarding/ImportWallet/ImportBackupTab.tsx
+++ b/apps/web/src/components/Onboarding/ImportWallet/ImportBackupTab.tsx
@@ -85,6 +85,9 @@ export const ImportBackupTab = () => {
width="full"
height="72px"
borderRadius="0"
+ _hover={{
+ bg: color("100"),
+ }}
onClick={() => inputRef.current?.click()}
rightIcon={}
variant="ghost"
diff --git a/apps/web/src/components/Onboarding/ImportWallet/SecretKeyTab.tsx b/apps/web/src/components/Onboarding/ImportWallet/SecretKeyTab.tsx
index 8d8f31d7e5..3decf10f81 100644
--- a/apps/web/src/components/Onboarding/ImportWallet/SecretKeyTab.tsx
+++ b/apps/web/src/components/Onboarding/ImportWallet/SecretKeyTab.tsx
@@ -47,6 +47,11 @@ export const SecretKeyTab = () => {
required: "Secret Key is required",
onChange: event => setIsEncrypted(isEncryptedSecretKeyPrefix(event.target.value)),
})}
+ _focusVisible={{
+ outline: "none",
+ borderColor: "gray.400",
+ boxShadow: "none",
+ }}
placeholder="Type here..."
/>
{errors.secretKey && {errors.secretKey.message}}
diff --git a/apps/web/src/components/Onboarding/ImportWallet/SeedPhraseTab.tsx b/apps/web/src/components/Onboarding/ImportWallet/SeedPhraseTab.tsx
index 868eae2328..cda74f3f2f 100644
--- a/apps/web/src/components/Onboarding/ImportWallet/SeedPhraseTab.tsx
+++ b/apps/web/src/components/Onboarding/ImportWallet/SeedPhraseTab.tsx
@@ -99,14 +99,14 @@ export const SeedPhraseTab = () => {
gap="10px"
color={color("900")}
borderBottom="1px solid"
- borderBottomColor={color("300")}
+ borderBottomColor={color("100")}
_expanded={{ borderBottomColor: "transparent" }}
>
{mnemonicSize} word seed phrase
-
+
{
trackButtonClick("onboarding", "use_existing_wallet");
return openWith(, {
size: "xl",
- variant: "onboarding",
});
}}
size="lg"
diff --git a/apps/web/src/styles/theme.ts b/apps/web/src/styles/theme.ts
index d08c2ec4a4..f70e1dd09a 100644
--- a/apps/web/src/styles/theme.ts
+++ b/apps/web/src/styles/theme.ts
@@ -77,6 +77,7 @@ const theme = extendTheme({
},
},
container: {
+ borderColor: "gray.100",
_last: {
borderBottomWidth: 0,
},
@@ -536,6 +537,10 @@ const theme = extendTheme({
paddingBottom: "20px",
paddingX: { base: "12px", md: "30px" },
},
+ overlay: {
+ background: "rgba(22, 22, 43, 0.80)",
+ backdropFilter: "blur(5px)",
+ },
},
},
Modal: {
@@ -603,13 +608,6 @@ const theme = extendTheme({
marginTop: "30px",
},
},
- variants: {
- onboarding: {
- dialog: {
- marginBottom: { base: 0, md: "100px" },
- },
- },
- },
},
Checkbox: {
baseStyle: {