Temporarily changing the theme for certain pages

[achadee]

Hi there, firstly, I love this project and thanks for working on it!

We have a few custom landing pages where the theme is dark. I was wondering if there was an option (or a way) to temporarily set the theme just for that page and not store the the new theme in localStorage. That way when the user visits another page, it doesn't carry across the theme.

Thanks

[pacocoursey]

Yep, that's exactly what the forcedTheme option does. Set a static property on your Page:

next-themes/examples/example/pages/dark.js

Line 11 in cb30afc

Page.theme = 'dark'

Then pass it along in your _app:

next-themes/examples/example/pages/_app.js

Line 6 in cb30afc

<ThemeProvider forcedTheme={Component.theme || undefined}>

It will set the theme for the page without modifying localStorage.

[achadee]

Beautiful! thank you so much, works a treat :)