Dark mode styles

[GarethChetwood]

It looks like the background colour of the option items is hard-coded to white, but this clashes when Sanity's dark mode makes the font colour white as well.

The options above should have an icon & some text, but it can't be seen due to the colours

Not sure how feasible it is, but if the background colour of the items adhered to the Sanity studio colours, it'd keep the problem outside of this plugin.

[GarethChetwood]

If it's not possible to hook into Sanity's current theme mode, I guess we would have to just go with something like this:

@media (prefers-color-scheme: dark) {
    .item {
        background-color: black;
    }
}

[nicktaylor]

Hey @GarethChetwood, thanks for reporting this and sorry for the delay in responding. I've been stacked lately. I'll see if I can get some time to at least take a look and figure out what needs to be done, without affecting other people, over the weekend. Cheers!

[nicktaylor]

@GarethChetwood This has now been resolved in version 2.0.1. Please note that this doesn't go into full dark mode, I've set the text to always be black, as the background is always white. The reason for this is for it not to be a breaking change. People may well have SVGs or transparent PNGs over the white background, therefore if I switch to a black background, and someone has, for example, black icons on top, they would no longer be able to see them.

In a future release I might consider adding an option to adhere to the the colour scheme, then people would need to be responsible for making sure any images work on both dark and light backgrounds, or implementing their own switching mechanism. I don't think I can make that the default behaviour or it could make the plugin harder to implement for people.