Vertical Menu Item

<esp-vertical-menu-item>

A menu item for the vertical navigation menu.

When an SVG (or other element) is slotted into the default slot, an icon column appears on the right side of the item. Without slotted content, the item renders as text only.

Attributes

<esp-vertical-menu-item> has the following attributes:

label

label has a default value of "".

Label to display.

url

url has a default value of "".

Resource to link to.

Events

<esp-vertical-menu-item> emits the following events:

clicked

clicked is of type CustomEvent.

Fired when the item is rendered as a button (no url) and the user activates it.

CSS Properties

<esp-vertical-menu-item> has the following CSS properties:

--esp-vertical-menu-item-color

The text color of the menu item.

--esp-vertical-menu-item-background

The background color of the menu item.

--esp-vertical-menu-item-border-color

The border color of the menu item.

--esp-vertical-menu-item-hover-color

The text color on hover.

--esp-vertical-menu-item-hover-background

The background color on hover.

--esp-vertical-menu-item-icon-background

The background color of the icon area.

--esp-vertical-menu-item-active-color

The text color of the active (current page) menu item.

--esp-vertical-menu-item-active-background

The background color of the active menu item.

Where does this show?