Closed oluijks closed 3 months ago
Hi :) I'm currently in the process of updating the docs, including installation & dark-mode guides for all the possible frameworks/setups.
But since the setup for a standard Solid app is only slightly different I can quickly show you how to modify the current setup guide: https://www.solid-ui.com/docs/dark-mode
You only need to change cookieStorageManagerSSR
to createLocalStorageManager
and you're done.
So the app.tsx
would look like this:
import "./App.css";
import { ModeToggle } from "~/components/mode-toggle";
import {
ColorModeProvider,
ColorModeScript,
createLocalStorageManager,
} from "@kobalte/core";
function App() {
const storageManager = createLocalStorageManager("vite-ui-theme");
return (
<>
<ColorModeScript storageType={storageManager.type} />
<ColorModeProvider storageManager={storageManager}>
<ModeToggle />
<p>HELLO WORLD</p>
</ColorModeProvider>
</>
);
}
export default App;
The mode-toggle.tsx
can be taken as is.
In the docs there is an example of implementing darkmode but that's for SolidStart. Is there an example of using this but with a standard Solid app or could the docs be updated with one?