Solved Dropdown menus in dark mode really hard to read

[d19dotca]

I’ve noticed that all dropdown menus in Cloudron when viewing via Safari on iOS is extremely difficult to read. It’s been like this for quite a while now, I just keep forgetting to post about it.

Does anyone else see this as well?

Here’s a screenshot of the dropdown on the Backups page:

Here’s another from the Mail page near the logs section:

[humptydumpty]

@d19dotca I'm seeing the same in Safari and Firefox on iOS.

[imc67]

@d19dotca yes and it’s really annoying

[nebulon]

@imc67 I do not have access to an iOS device readily available. This seems some issue with the iOS native widget rendering and the custom css for dark-mode. Once I can actually reproduce and test this myself, this should be easy to fix.

[robi]

@nebulon perhaps you can set up a test page and we can send you screen shots of the results.

[d19dotca]

@nebulon I wonder if a browser emulator would work well too, those are freely available online. Might need to take one that can access privileged pages though I guess.

[nebulon]

I got hold of an iPhone temporarily to test this and I've fixed this now with https://git.cloudron.io/cloudron/dashboard/-/commit/ff5ad8b062414d8a972631a19b181c80d2adc15d

Essentially we avoid rendering the native select dropdown button but style it ourselves so we can control also how the dark-mode rendering is done.