Side Navigation Item Label

Is there a reason why the label slot of vaadin-side-nav-item has no name?
It’s very hard to change the color without Aura.

There is a selector

vaadin-side-nav > [slot=“label”]`

That’s the label of the parent component. I am looking for the menu item’s label.

Ah right. It’s

vaadin-side-nav-item::part(link)

Appreciate your effort, but the link contains prefix & suffix. I want to change the label’s color only.

I see. Then you should open a change request:

What exactly do you mean with “without Aura”?

In Lumo? Or in Aura, but without using custom properties?

Nevertheless, it should doable in Lumo and in Aura:

In Lumo it should be enough to change the color on the side nav item itself

In Aura, you can use custom properties to set the label’s text color and then override for instance icon colors.

Is that what you wanted to achieve?

What exactly do you mean with “without Aura”?

In the Styling section of the Side Navigation it says that --vaadin-side-nav-item-text-color is only for Aura. So I looked into the Aura styles and it looked complicate. Setting the color directly on the vaadin-side-nav-item was too easy to even think about… ;)
I will check tomorrow if it will work for my requirements.

Thank You and Simon, of course

1 Like