28 lines
1.1 KiB
TypeScript
28 lines
1.1 KiB
TypeScript
import { Html, Head, Main, NextScript } from "next/document";
|
|
|
|
/**
|
|
* Custom Document to inject an early theme script so the dark-mode preference
|
|
* (stored in localStorage under key 'theme': 'dark' | 'light') is applied
|
|
* before the first paint. This verhindert ein "Flash" von Light-Mode beim
|
|
* Seitenwechsel / Reload in der statisch gebauten Produktion.
|
|
*/
|
|
export default function Document() {
|
|
const setThemeScript = `(()=>{try{const k='theme';const t=localStorage.getItem(k);const m=window.matchMedia('(prefers-color-scheme: dark)').matches;const useDark = t? t==='dark' : m;const c=document.documentElement.classList;useDark?c.add('dark'):c.remove('dark');}catch(e){/* ignore */}})();`;
|
|
return (
|
|
<Html lang="de">
|
|
<Head>
|
|
<link rel="icon" href="/favicon.png" type="image/png" />
|
|
{/* Early inline script (no external blocking) */}
|
|
<script
|
|
// eslint-disable-next-line react/no-danger
|
|
dangerouslySetInnerHTML={{ __html: setThemeScript }}
|
|
/>
|
|
</Head>
|
|
<body>
|
|
<Main />
|
|
<NextScript />
|
|
</body>
|
|
</Html>
|
|
);
|
|
}
|