alpine-collective / alpinejs-devtools

Chrome/Firefox DevTools extension for debugging Alpine.js applications.
MIT License
522 stars 18 forks source link

Feature Request - Dark Mode #321

Closed webdevnerdstuff closed 2 years ago

webdevnerdstuff commented 2 years ago

It would be nice if you added a dark mode. That'll make it even better when a user has everything else set to dark.

HugoDF commented 2 years ago

We might be able to use something like this https://nightwindcss.com

I'm happy to look at PRs implementing this but I haven't had much time to implement anything new in devtools recently.

webdevnerdstuff commented 2 years ago

I forked the repo and am taking a look. It's a bit to wrap my head around to get familiar with the code. When I have some more time I'll try to look deeper into Nightwind. I haven't used Tailwind much yet, so I need to get a little familiar with it as well. So, we'll see if I can pull something together, but if anybody else wants to add dark theme support, please feel free. :)

Couple of questions for you:

I do see that you have "themes" in the code for light and dark-header, but I don't think it's being used currently as light looks incomplete when turned on. Would this be something to replace/update?

I also see that you have some prep work for a "Settings" page that is currently empty. Do you want to use that, or just add a new side tab for "Settings' in panel.edge?

Adding this link for reference. https://tailwindcss.com/docs/dark-mode