Filament•16mo ago

Set dark mode on by default

Is there a way to set the theme localStorage variable to 'dark' by default for everyone, instead of 'system'? My website has a dark color, not switchable. If someone has light mode in the system, and tries to log in, it would blind them permanently 😄 Of course if it's not possible, I'll edit the base bg colors in css to dark ones, but would be nice to still have the light mode option, although not as the default.

8 Replies

HLOP•16mo ago

I figured out something for it: In the panelprovider, put this:

return $panel
...
->renderHook(
                'panels::head.start',
                fn (): View => view('path_to_file'),
            );

return $panel
...
->renderHook(
                'panels::head.start',
                fn (): View => view('path_to_file'),
            );

In the file, simply put this:

<script>
    if (!localStorage.getItem('theme')) {
        localStorage.setItem('theme', 'dark');
    }
</script>

<script>
    if (!localStorage.getItem('theme')) {
        localStorage.setItem('theme', 'dark');
    }
</script>

I'm not sure why, but I cannot mark this as the solution, there is no Apps option after right click

HLOP•16mo ago

HLOP•16mo ago

Actually this is much better:

$panel
            ->darkMode(true, true)

$panel
            ->darkMode(true, true)

awcodes•16mo ago

Saw this earlier. Got distracted, then the day happened. Totally slipped my mind. Sorry. Glad you found the answer though.

jay02k•16mo ago

yes it work but it remove the option to use light mode?

HLOP•15mo ago

If your aim is to force it but have the option, then you could try my first method making a renderHook and add that script to the header or end of body

jay02k•15mo ago

where can i check that sample method?

HLOP•15mo ago

here also you need to have $panel->darkmode(true) for it I think, so only with one true not two

Gaming

Programming

Set dark mode on by default