From c1951b29b9bed09348e89b70b25109d9956b1f4e Mon Sep 17 00:00:00 2001 From: neodk2004 Date: Fri, 21 Aug 2026 22:24:09 +0200 Subject: [PATCH] fix(auth): remove hardcoded light-mode Clerk appearance override on log-in/sign-up SignIn/SignUp passed their own appearance.variables.colorBackground ("#FAFAFA", always light) and colorPrimary, which Clerk merges on top of ClerkThemeProvider's appearance -- so in Dark Mode the provider's baseTheme: dark (light-on-dark default text colors) stayed active while colorBackground got forced back to light by the page-level override. Light text on a light background made the whole form unreadable. Both page-level appearance props now only set elements.formButtonPrimary (the orange CTA, theme-independent) -- colorPrimary/colorBackground are already handled correctly, theme-aware, by ClerkThemeProvider. --- src/app/(auth)/log-in/[[...sign-in]]/page.tsx | 4 ---- src/app/(auth)/sign-up/[[...sign-up]]/page.tsx | 4 ---- 2 files changed, 8 deletions(-) diff --git a/src/app/(auth)/log-in/[[...sign-in]]/page.tsx b/src/app/(auth)/log-in/[[...sign-in]]/page.tsx index c12b517..0e2268c 100644 --- a/src/app/(auth)/log-in/[[...sign-in]]/page.tsx +++ b/src/app/(auth)/log-in/[[...sign-in]]/page.tsx @@ -17,10 +17,6 @@ export default function LogInPage() { signUpUrl="/sign-up" forceRedirectUrl="/pets" appearance={{ - variables: { - colorPrimary: "#F97316", - colorBackground: "#FAFAFA", - }, elements: { formButtonPrimary: "bg-orange-500 hover:bg-orange-600 text-white text-sm", diff --git a/src/app/(auth)/sign-up/[[...sign-up]]/page.tsx b/src/app/(auth)/sign-up/[[...sign-up]]/page.tsx index 3dff02d..2a66804 100644 --- a/src/app/(auth)/sign-up/[[...sign-up]]/page.tsx +++ b/src/app/(auth)/sign-up/[[...sign-up]]/page.tsx @@ -17,10 +17,6 @@ export default function SignUpPage() { signInUrl="/log-in" forceRedirectUrl="/onboarding/pet" appearance={{ - variables: { - colorPrimary: "#F97316", - colorBackground: "#FAFAFA", - }, elements: { formButtonPrimary: "bg-orange-500 hover:bg-orange-600 text-white text-sm",