Help Me Stop Theme Flashing In SolidStart
I built a theme switcher using SolidStart. It works great, with one exception. On page reload, the theme flickers or flashes.
It's happening because I'm using SSR mode. As a result, my
I believe I need to check the theme on the server so I can set the theme before my page loads using something like https://github.com/donavon/use-dark-mode/blob/develop/noflash.js.txt.
Next.js has the next-themes package that does this for you. https://github.com/pacocoursey/next-themes
I'm wondering how I can do this? Can anyone point me in the right direction? Or share some example code?
I've pasted my ThemeProvider code in the next post:
It's happening because I'm using SSR mode. As a result, my
ThemeProviderI believe I need to check the theme on the server so I can set the theme before my page loads using something like https://github.com/donavon/use-dark-mode/blob/develop/noflash.js.txt.
Next.js has the next-themes package that does this for you. https://github.com/pacocoursey/next-themes
I'm wondering how I can do this? Can anyone point me in the right direction? Or share some example code?
I've pasted my ThemeProvider code in the next post:
GitHub
Perfect Next.js dark mode in 2 lines of code. Support System preference and any other theme with no flashing - pacocoursey/next-themes
