e4dcfc49aa
Tests / Import Check (Python 3.13) (push) Has been cancelled
Tests / Import Check (Python 3.14) (push) Has been cancelled
Tests / Python Tests (Python 3.11) (push) Has been cancelled
Tests / Python Tests (Python 3.12) (push) Has been cancelled
Tests / Python Tests (Python 3.14) (push) Has been cancelled
Tests / Test Summary (push) Has been cancelled
Tests / Lint and Format (push) Has been cancelled
Tests / Web Node Tests (push) Has been cancelled
Tests / Import Check (Python 3.11) (push) Has been cancelled
Tests / Import Check (Python 3.12) (push) Has been cancelled
Tests / Python Tests (Python 3.13) (push) Has been cancelled
50 lines
1.7 KiB
TypeScript
50 lines
1.7 KiB
TypeScript
/**
|
|
* ThemeScript - Initializes theme from localStorage before React hydration
|
|
* This prevents the flash of wrong theme on page load.
|
|
*
|
|
* Must be a Server Component: in Next.js / React 19, <script> tags rendered
|
|
* by Client Components are inert on the client. Rendering it from the server
|
|
* inlines the snippet into the SSR HTML so the browser executes it before
|
|
* hydration.
|
|
*/
|
|
export default function ThemeScript() {
|
|
const themeScript = `
|
|
(function() {
|
|
try {
|
|
const stored = localStorage.getItem('deeptutor-theme');
|
|
|
|
document.documentElement.classList.remove('dark', 'theme-glass', 'theme-snow');
|
|
|
|
if (stored === 'dark') {
|
|
document.documentElement.classList.add('dark');
|
|
} else if (stored === 'glass') {
|
|
document.documentElement.classList.add('dark', 'theme-glass');
|
|
} else if (stored === 'snow') {
|
|
document.documentElement.classList.add('theme-snow');
|
|
} else if (stored === 'light') {
|
|
// already clean
|
|
} else {
|
|
// No stored preference: Default (snow) for light systems,
|
|
// Dark for prefers-color-scheme: dark.
|
|
if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
|
document.documentElement.classList.add('dark');
|
|
localStorage.setItem('deeptutor-theme', 'dark');
|
|
} else {
|
|
document.documentElement.classList.add('theme-snow');
|
|
localStorage.setItem('deeptutor-theme', 'snow');
|
|
}
|
|
}
|
|
} catch (e) {
|
|
/* localStorage may be disabled */
|
|
}
|
|
})();
|
|
`;
|
|
|
|
return (
|
|
<script
|
|
dangerouslySetInnerHTML={{ __html: themeScript }}
|
|
suppressHydrationWarning
|
|
/>
|
|
);
|
|
}
|