Opt-in dark mode support

[fotrino]

This PR introduces opt-in dark mode support to Jetstream, borrowed from @jessarcher PR on Breeze

php artisan jetstream:install {stack} --dark

Following the previous mentioned PR, the dark mode classes will be stripped unless dark mode is enabled.
When installing livewire stack without dark mode, the components will be published in order to strip the dark classes from them.

Screenshots

Light	Dark

Notes

• I copied the styles of inputs & buttons from Breeze PR, which will change colors from blue to indigo, happy to change back all to blue if this presents a problem.
• I used Livewire stack as a basis and then copied to Vue, while doing this I found minor inconsistencies between the stacks which are now improved. This includes the caret icon in the user's dropdown and some minor visual differences - keep this in mind when reviewing the diff.
• I've included the fix focus styling in this and included the dark mode options.

[taylorotwell]

Thanks for looking into this. It feels like we may want to address this issue of the black text on dark background in the logo before merging?

[fotrino]

Great idea! Just updated to use the dark-mode compatible logo in the repo art.

Light	Dark

[driesvints]

@fotrino thanks but looks a bit awkward. Can't we make it so it has completely white letters and no border on the icon?

[driesvints]

Might need to duplicate the SVG logo

[fotrino]

@driesvints thanks for the input, also thought it was a bit off but was trying to follow the existing SVG.
I came up with another solution, use fill classes on the SVG. Let me know what you think about it.

Light	Dark

[driesvints]

Looks much better!

[n1crack]

Nice one, I hope it releases soon .. I have tried dark mode myself before but it wasn't good enough. here is the version of mine :)

[fotrino]

@driesvints the SVG are updated. Please let me know if there is anything else that needs to be looked into :)

[taylorotwell]

Thanks!

[driesvints]

Thanks @fotrino!

[ziming]

I installed jetstream months ago, this morning I did a composer update. I never ran any jetstream:install --dark command

Tonight my sites suddenly look weird with some parts in dark and some parts in white.

It looks like this dark mode is not really opt in after all.

Screenshot attached, hope it helps. I do like dark mode a lot but perhaps it is not ready yet

[taylorotwell]

This will have to be reverted.

[dah-HUB]

Hi there,
Please how to enable/disable dark mode programmatically ?
Thanks

[jessarcher]

Hi there, Please how to enable/disable dark mode programmatically ? Thanks

Jetstream uses Tailwind to handle dark mode. The Tailwind docs have a section on manually toggling dark mode at https://tailwindcss.com/docs/dark-mode#toggling-dark-mode-manually.