Table to dark mode

Hello there, I'm aware that, panel builder has dark mode. but i'm using table outside of panel builder. just on livewire page. i would like to display table in dark mode. how do i do that? thank you
Solution:
You should do the table builder setup if you are using tables outside panel builder
Jump to solution
13 Replies
Roberto
Roberto8mo ago
yes and where do i apply dark class? i applied like this in livewire blade page didn't work <div class="dark mt-6"> {{ $this->table }} </div>
LeandroFerreira
LeandroFerreira8mo ago
Did you add this in the tailwind config?
import preset from './vendor/filament/support/tailwind.config.preset'
export default {
presets: [preset],
...
import preset from './vendor/filament/support/tailwind.config.preset'
export default {
presets: [preset],
...
it has darkMode: 'class'
Andrew Wallo
Andrew Wallo8mo ago
Or you can just use dark prefix as well for the background color
LeandroFerreira
LeandroFerreira8mo ago
what does it mean?
Andrew Wallo
Andrew Wallo8mo ago
Just the “dark:bg-gray-*”? The prefix
LeandroFerreira
LeandroFerreira8mo ago
I think this should work
<div class="dark">
{{ $this->table }}
</div>
<div class="dark">
{{ $this->table }}
</div>
Andrew Wallo
Andrew Wallo8mo ago
Yeah it can, I was just giving another option for him If it didn’t work
Roberto
Roberto8mo ago
do i need to do this if i also have panel builder installed?
LeandroFerreira
LeandroFerreira8mo ago
panel builder has dark mode You said but i'm using table outside of panel builder
Roberto
Roberto8mo ago
i have installed panel builder for admin panel i'm using table outside of panel builder but when i follow table installation instructions. all those instructions are already there like app.css contents e.t.c are already there due to previous panel builder installation.
Solution
LeandroFerreira
LeandroFerreira8mo ago
You should do the table builder setup if you are using tables outside panel builder
Roberto
Roberto8mo ago
wow it worked thank you 🙂