You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
64 lines
2.0 KiB
64 lines
2.0 KiB
/*
|
|
* Copyright (c) Facebook, Inc. and its affiliates.
|
|
*/
|
|
|
|
import * as React from 'react';
|
|
import {Html, Head, Main, NextScript} from 'next/document';
|
|
|
|
const MyDocument = () => {
|
|
// @todo specify language in HTML?
|
|
return (
|
|
<Html lang="en">
|
|
<Head />
|
|
<body className="font-sans antialiased text-lg bg-wash dark:bg-wash-dark text-secondary dark:text-secondary-dark leading-base">
|
|
<script
|
|
dangerouslySetInnerHTML={{
|
|
__html: `
|
|
(function () {
|
|
function setTheme(newTheme) {
|
|
window.__theme = newTheme;
|
|
if (newTheme === 'dark') {
|
|
document.documentElement.classList.add('dark');
|
|
} else if (newTheme === 'light') {
|
|
document.documentElement.classList.remove('dark');
|
|
}
|
|
}
|
|
|
|
var preferredTheme;
|
|
try {
|
|
preferredTheme = localStorage.getItem('theme');
|
|
} catch (err) { }
|
|
|
|
window.__setPreferredTheme = function(newTheme) {
|
|
preferredTheme = newTheme;
|
|
setTheme(newTheme);
|
|
try {
|
|
localStorage.setItem('theme', newTheme);
|
|
} catch (err) { }
|
|
};
|
|
|
|
var initialTheme = preferredTheme;
|
|
var darkQuery = window.matchMedia('(prefers-color-scheme: dark)');
|
|
|
|
if (!initialTheme) {
|
|
initialTheme = darkQuery.matches ? 'dark' : 'light';
|
|
}
|
|
setTheme(initialTheme);
|
|
|
|
darkQuery.addEventListener('change', function (e) {
|
|
if (!preferredTheme) {
|
|
setTheme(e.matches ? 'dark' : 'light');
|
|
}
|
|
});
|
|
})();
|
|
`,
|
|
}}
|
|
/>
|
|
<Main />
|
|
<NextScript />
|
|
</body>
|
|
</Html>
|
|
);
|
|
};
|
|
|
|
export default MyDocument;
|
|
|