From 0984413e2f041f0b8e27046146183faf77ef20c2 Mon Sep 17 00:00:00 2001 From: Joshua Date: Tue, 18 Oct 2022 23:00:35 +0200 Subject: [PATCH] make the theme loading work somehow --- components/Navbar.tsx | 2 +- components/toggle/theme.tsx | 4 ++-- pages/_app.tsx | 12 +++++++----- 3 files changed, 10 insertions(+), 8 deletions(-) diff --git a/components/Navbar.tsx b/components/Navbar.tsx index 1b9085e..3bb3bcb 100644 --- a/components/Navbar.tsx +++ b/components/Navbar.tsx @@ -7,7 +7,7 @@ const Navbar = () => { <>
- <ThemeToggle/> + <ThemeToggle /> </div> </> ); diff --git a/components/toggle/theme.tsx b/components/toggle/theme.tsx index b651fcd..37223f2 100644 --- a/components/toggle/theme.tsx +++ b/components/toggle/theme.tsx @@ -12,11 +12,11 @@ function the(t) { } const ThemeToggle = () => { - const { resolvedTheme: theme, setTheme } = useTheme(); + const { resolvedTheme: theme, setTheme: set } = useTheme(); return ( <> - <button data-theme={theme} onClick={() => setTheme(the(theme))} className={styles.button}> + <button data-theme={theme} onClick={() => set(the(theme))} className={styles.button}> <Icon icon="asterisk" /> </button> </> diff --git a/pages/_app.tsx b/pages/_app.tsx index d39ba45..1fa51ab 100644 --- a/pages/_app.tsx +++ b/pages/_app.tsx @@ -4,18 +4,20 @@ import { ThemeProvider } from "next-themes"; import "../styles/main.sass"; import LoadingScreen from "components/LoadingScreen"; -function MyApp({ Component, pageProps }) { +function Void({ Component, pageProps }) { const [loading, setLoading] = useState(true) + useEffect(() => setLoading(false), []) - return ( + if (loading) return <LoadingScreen isLoading={loading} /> - <ThemeProvider> - <LoadingScreen isLoading={loading} /> + return ( + <ThemeProvider enableSystem enableColorScheme > + {/* <LoadingScreen isLoading={loading} /> */} <Component {...pageProps} /> </ThemeProvider> ); } -export default MyApp; +export default Void;