From 73fc2f6c4ab9ed7c21990c4f754253dd919a243e Mon Sep 17 00:00:00 2001 From: Kevin Ingersoll Date: Thu, 18 Apr 2024 17:53:19 +0100 Subject: [PATCH] small tweaks --- packages/account-kit/src/bundle/mount.tsx | 2 + .../account-kit/src/bundle/mountButton.tsx | 2 + packages/account-kit/src/ui/Shadow.tsx | 37 +++++++++++++------ 3 files changed, 30 insertions(+), 11 deletions(-) diff --git a/packages/account-kit/src/bundle/mount.tsx b/packages/account-kit/src/bundle/mount.tsx index 440248aabe..d650fb438a 100644 --- a/packages/account-kit/src/bundle/mount.tsx +++ b/packages/account-kit/src/bundle/mount.tsx @@ -3,6 +3,8 @@ import type { Config as WagmiConfig } from "wagmi"; import type { Config as AccountKitConfig } from "../AccountKitProvider"; import { store } from "./store"; +// TODO: ensure we only mount modal + export type MountOptions = { rootElementId?: string; wagmiConfig: WagmiConfig; diff --git a/packages/account-kit/src/bundle/mountButton.tsx b/packages/account-kit/src/bundle/mountButton.tsx index 8f4c2e6b0d..9a59a73dbe 100644 --- a/packages/account-kit/src/bundle/mountButton.tsx +++ b/packages/account-kit/src/bundle/mountButton.tsx @@ -4,6 +4,8 @@ import type { Config as AccountKitConfig } from "../AccountKitProvider"; import { store } from "./store"; import { AccountButton } from "../AccountButton"; +// TODO: ensure we only mount modal + export type MountOptions = { wagmiConfig: WagmiConfig; accountKitConfig: AccountKitConfig; diff --git a/packages/account-kit/src/ui/Shadow.tsx b/packages/account-kit/src/ui/Shadow.tsx index 764e9ea198..2c90af6e07 100644 --- a/packages/account-kit/src/ui/Shadow.tsx +++ b/packages/account-kit/src/ui/Shadow.tsx @@ -39,12 +39,27 @@ export const Shadow = forwardRef(function Shadow({ mod const darkMode = useMediaQuery("(prefers-color-scheme: dark)"); const theme = initialTheme ?? (darkMode ? "dark" : "light"); - const modeStyle: CSSProperties = + const frameStyle: CSSProperties = mode === "modal" - ? { display: "block", position: "fixed", inset: "0", width: "100vw", height: "100vh", zIndex: "2147483646" } + ? { + all: "unset", + display: "block", + position: "fixed", + inset: "0", + width: "100vw", + height: "100vh", + zIndex: "2147483646", + } : frameSize.width && frameSize.height - ? { display: "inline-block", width: `${frameSize.width}px`, height: `${frameSize.height}px` } + ? { + all: "unset", + display: "inline-block", + width: `${frameSize.width}px`, + height: `${frameSize.height}px`, + boxShadow: "0 0 0 4px red", + } : { + all: "unset", display: "block", position: "fixed", inset: "0", @@ -57,20 +72,20 @@ export const Shadow = forwardRef(function Shadow({ mod return (