From f9cd68181137c72e92c6951efd9b8d29c4b73bc1 Mon Sep 17 00:00:00 2001 From: Tom van der Lee Date: Tue, 25 Jan 2022 21:42:51 +0100 Subject: Added dark mode --- src/hooks/useDarkMode.tsx | 21 +++++++++++++++++++++ 1 file changed, 21 insertions(+) create mode 100644 src/hooks/useDarkMode.tsx (limited to 'src/hooks/useDarkMode.tsx') diff --git a/src/hooks/useDarkMode.tsx b/src/hooks/useDarkMode.tsx new file mode 100644 index 0000000..fe4ce95 --- /dev/null +++ b/src/hooks/useDarkMode.tsx @@ -0,0 +1,21 @@ +import {useEffect, useMemo, useState} from "react"; +import {ThemeConfig} from "bootstrap-darkmode"; + +export interface UseDarkMode { + darkMode: boolean + toggle: () => void +} + +export default function useDarkMode() { + const themeConfig = useMemo(() => new ThemeConfig(), []); + const [darkMode, setDarkMode] = useState(() => themeConfig.getTheme() === 'dark') + + useEffect(() => { + themeConfig.setTheme(darkMode ? 'dark' : 'light'); + }, [darkMode]) + + return { + darkMode, + toggle: () => setDarkMode(dm => !dm), + } +} -- cgit v1.2.3