Toggling

[Knaackee]

Hey!

Thanks for making this!

How do you toggle the theme? I know I can send a POST request to the action but how do you do it exactly? Using a Form?

[abereghici]

Hey @Knaackee You can toggle the theme by using the useTheme hook from remix-themes. You can check this example: https://github.com/abereghici/remix-themes/blob/main/demo/app/routes/about.tsx#L5

[abereghici]

@Knaackee if you're interested in how it's working under the hood, in ThemeProvider there is a react effect that makes a POST request using fetch every time the theme is changed. https://github.com/abereghici/remix-themes/blob/main/src/theme-provider.tsx#L59

[Knaackee]

Thanks!

How about changing the route so that it will work without JavaScript (activated or not yet loadad) ?

[abereghici]

@Knaackee You can always make a post request and send the theme to the action route. For example, the route that changes the theme in the demo app is /action/set-theme ( https://github.com/abereghici/remix-themes/blob/main/demo/app/root.tsx#L77 )

Here is an untested example:

<Form method="post" action="/action/set-theme" reloadDocument>
   <input hidden name="theme" value="light" />
   <button type="submit">Change</button>
</Form>

[Knaackee]

Ah thats great. I missed reloadDocument