feat(layout): add theme script to prevent light mode flash during hydration

2026-08-26 18:33:30 +07:00
parent cacebfd94e
commit 192685e1ce
1 changed files with 13 additions and 1 deletions
@@ -44,9 +44,21 @@ export default function RootLayout({
  return (
    <html
      lang="en"
-      className={`${inter.variable} ${jetbrainsMono.variable} ${bricolage.variable} h-full antialiased`}
+      className={`${inter.variable} ${jetbrainsMono.variable} ${bricolage.variable} h-full antialiased dark`}
      suppressHydrationWarning
    >
      <head>
        {/*
          Blocking script: apply saved theme (or default "dark") before first
          paint so the page never flashes light mode during client-side
          navigation or hydration. next-themes will take over after mount.
        */}
        <script
          dangerouslySetInnerHTML={{
            __html: `(function(){try{var t=localStorage.getItem('theme');document.documentElement.className+=' '+(t||'dark')}catch(e){}})()`,
          }}
        />
      </head>
      <body className="min-h-full flex flex-col">
        <SwrProvider>
          <ThemeProvider