How to set MenuItem icon color?

[pop1989bb]

Hi guys,

is it possible to set the menu item icon color via CSS?
I tried the className property for setting a class name but apparently it isn't applied to the HTML.
If I understand the docu correct it isn't intended. So is there a way to customize the colors per item?

Kind regards

[Lukas742]

Hi @pop1989bb

you are correct, currently the MenuItem isn't stylable by standard means. As far as I know, it's planned to refactor the MenuItem from an abstract item to a physical one, but this change will only be available with v2.0.

I'm not sure if there's a recommended way of changing the icon color and since the Menu and all of its subcomponents are developed by the UI5 Web Components team, I'm going to transfer this question to their repo.

[pop1989bb]

@Lukas742
Thank you.

[ilhan007]

Hi @pop1989bb is upgrading to 2.0-rc.X option for you. As Lukas said we improved our popover-based components significantly by integrating the Popover API standard and one of the benefits is the extended styling capabilities of the the dropdown items like the Menu item.

[pop1989bb]

Hi @ilhan007
a good question. Does it work for the React components as well? At least it sounds promising.

[ilhan007]

The colleagues from UI5 Web Components For React are in a process of adopting the UI5 Web Components changes and will soon come up with a version I believe we are not far from that point, so it will work for sure, it's just not consumable right now.

As for the timelines:
From UI5 Web Components side, we are currently on 2.0.0-rc.6, and the plan is to release 2.0 stable release on 2nd -3rd July
@Lukas742 can add on the timelines from UI5 Web Components For React side

[pop1989bb]

ok. Thank you!