CODEWITHSUNDEEP
authenticationuser-interfaceclerk
Nate Near
Nate Near

Reputation: 1

Not able to see ui/appearance changes in clerk

I've been using clerk in one of my projects and after making the project and deploying it I discovered that we can change the UI to dark mode and remove the development mode footer enter image description here

But somehow I'm trying to apply the changes but the changes won't appear on the signUp and signIn pages.

Here is the code:

app/layout.tsx

import { ClerkProvider } from '@clerk/nextjs'
import './globals.css'
import Header from '@/components/header'
import { ThemeProvider } from "@/components/ui/theme-provider"
import { dark } from '@clerk/themes'

export default function RootLayout({
  children,
}: {
  children: React.ReactNode
}) 

{
  return (
    <ClerkProvider appearance={{
      baseTheme: dark,
    }}>
      <html lang="en">
        <body>
        <ThemeProvider
            attribute="class"
            defaultTheme="system"
            enableSystem
            disableTransitionOnChange
          >
          <Header/>
          {children}
          </ThemeProvider>
        </body>
      </html>
    </ClerkProvider>
  )
}

Upvotes: 0

Views: 51

Answers (0)

Related Questions