From ea1cb2c008a413dccbbe86f2a72b9a410cfb7eec Mon Sep 17 00:00:00 2001
From: JunichiSugiura <jun.sugiura.jp@gmail.com>
Date: Thu, 13 Jun 2024 12:31:06 +0200
Subject: [PATCH] Apply whitelabel theme to authenticate page

---
 packages/keychain/src/components/connect/Signup.tsx       | 8 +++++---
 .../keychain/src/components/layout/Container/index.tsx    | 1 -
 packages/keychain/src/pages/_app.tsx                      | 4 ++++
 3 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/packages/keychain/src/components/connect/Signup.tsx b/packages/keychain/src/components/connect/Signup.tsx
index 9d2d0e258..adeb56a83 100644
--- a/packages/keychain/src/components/connect/Signup.tsx
+++ b/packages/keychain/src/components/connect/Signup.tsx
@@ -41,15 +41,17 @@ export function Signup({
     setIsLoading(true);
     setIsRegistering(true);
 
+    const searchParams = new URLSearchParams(window.location.search);
+    searchParams.set("name", encodeURIComponent(values.username))
+    searchParams.set("action", "signup")
+
     // due to same origin restriction, if we're in iframe, pop up a
     // window to continue webauthn registration. otherwise,
     // display modal overlay. in either case, account is created in
     // authenticate component, so we poll and then deploy
     if (isIframe()) {
       PopupCenter(
-        `/authenticate?name=${encodeURIComponent(
-          values.username,
-        )}&action=signup`,
+        `/authenticate?${searchParams.toString()}`,
         "Cartridge Signup",
         480,
         640,
diff --git a/packages/keychain/src/components/layout/Container/index.tsx b/packages/keychain/src/components/layout/Container/index.tsx
index 18de6d93d..05d325ec6 100644
--- a/packages/keychain/src/components/layout/Container/index.tsx
+++ b/packages/keychain/src/components/layout/Container/index.tsx
@@ -72,7 +72,6 @@ function Wrapper({ variant = "default", children, ...rest }: React.PropsWithChil
             borderWidth={1}
             borderColor="solid.primaryAccent"
             verticalAlign="middle"
-            // m="auto auto"
             bg="solid.bg"
             p={0}
             as={motion.div}
diff --git a/packages/keychain/src/pages/_app.tsx b/packages/keychain/src/pages/_app.tsx
index 7e716e2e8..7af6fe948 100644
--- a/packages/keychain/src/pages/_app.tsx
+++ b/packages/keychain/src/pages/_app.tsx
@@ -50,6 +50,10 @@ export default function Keychain({ Component, pageProps }: AppProps) {
           --font-inter: ${inter.style.fontFamily};
           --font-ibm-plex-mono: ${ibmPlexMono.style.fontFamily};
         }
+
+        body {
+          background: var(--chakra-colors-solid-bg);
+        }
       `}</style>
 
       <Provider>