Remove dropdown icons (or make adaptive)

Thlayli wrote 5 years ago: 1

I reported a "bug" two years ago that the icons in the status dropdowns were missing/broken in iOS. It was determined that WebKit didn't support them, and that was that.

I've been using Chrome for Windows for a while and everything was fine. Icons work perfectly. I recently started using Firefox Quantum and the icons are broken.

I looked into it, and the real issue is that putting HTML into an OPTION tag is disallowed in the HTML specification. Firefox and WebKit are behaving properly. It's not supposed to work.

There are solutions using JS (e.g. Select2, bootstrap-select). I suppose you could also just show them in supported browsers if you're already checking browsers for compatibility, but I'd be fine with the icons being removed from the dropdown list.

I'm just really tired of seeing boxes and question marks every time I use a menu. The icons aren't necessary, and I think only Edge and Chrome support them.

gazza911 wrote 5 years ago: 1

As a note, it's not actually HTML which is being included in the dropdowns, it's actually unicode characters.

Unicode characters on select options are intentionally no longer supported by certain browsers (no idea why though).

mero wrote 5 years ago: 1

As another note, since they are using jQuery and jQuery ui, it's actually very easy to replace the dropdowns to a custom one. They just need to add one or two line of JS.

https://jqueryui.com/selectmenu/

david wrote 5 years ago: 1

We've noticed the same thing. Work in progress! :)

Jan wrote 5 years ago: 1

This has been improved. Let us know should you notice any other issues.