From a169688c6665a1087520f9c8b3f1b6c3256bfcc3 Mon Sep 17 00:00:00 2001 From: Amit Dhamu Date: Tue, 26 Sep 2023 14:24:58 +0100 Subject: [PATCH] still shit --- src/hooks/useTheme.ts | 13 ++++++++++++- src/index.html | 3 ++- 2 files changed, 14 insertions(+), 2 deletions(-) diff --git a/src/hooks/useTheme.ts b/src/hooks/useTheme.ts index 4a9ded3..4f25bc7 100644 --- a/src/hooks/useTheme.ts +++ b/src/hooks/useTheme.ts @@ -1,10 +1,11 @@ -import { useContext, useMemo, useState } from 'react' +import { useContext, useEffect, useMemo, useState } from 'react' import { SettingsContext } from '../context/SettingsProvider' import { getTheme } from '../theme' export const useTheme = () => { const { + setSetting, settings: { themeLight, themeDark, @@ -14,6 +15,10 @@ export const useTheme = () => { const [theme, setTheme] = useState(getTheme(prefersDarkMode)) + useEffect(() => { + setSetting('prefersDarkMode', prefersDarkMode) + }, []) + useMemo(() => { let themeToSet @@ -25,6 +30,9 @@ export const useTheme = () => { .map(([key, value]) => `--startpage-${key}: ${value}`) .join(';')}}` ) + document.styleSheets[0].insertRule( + localStorage.getItem('darkCssProperties') || '' + ) } else { themeToSet = themeLight ?? getTheme(false) window.localStorage.setItem( @@ -33,6 +41,9 @@ export const useTheme = () => { .map(([key, value]) => `--startpage-${key}: ${value}`) .join(';')}}` ) + document.styleSheets[0].insertRule( + localStorage.getItem('lightCssProperties') || '' + ) } if (JSON.stringify(themeToSet) !== JSON.stringify(theme)) { diff --git a/src/index.html b/src/index.html index 6f7bed9..0bc88e9 100644 --- a/src/index.html +++ b/src/index.html @@ -11,7 +11,6 @@ -
+
\ No newline at end of file