I am trying to create a dropdown with variable options where the options are different colours. I would also like the active option to fill the collapsed dropdown.
I have tried dbc.dropdownmenu with dbc.dropdownmenuitems. However, this fails as the collapsed dropdown menu does not update.
I have tried dcc.dropdown. However, the options are not coloured unless ‘active’ and I cannot see a way to colour options in the expanded format.
Would anyone know the best way of achieving this behaviour?
Hey @hail_toad welcome to the forums.
Does this help?
If you are using dcc.Dropdown, there is an example in the docs for how to format the dropdown labels. See the Styling Components As Option Labels section:
Hi thanks. This looked promising but went for the below answer as I did not have to install additional packages.
Thanks, with some extra work this was successful. I had to add additional code to increase the width of the span and a callback to update the style of the dropdown, as my styling involved background colour and there were white edges around the element before doing this.