Context Menu
Styling API reference for the Context Menu component.
- Usage
- Styling
CSS Selectors
The following CSS selectors can be used in stylesheets to target the various parts and states of the component.
- Root element
-
vaadin-context-menu-overlay
Parts
- Overlay background
-
vaadin-context-menu-overlay
::part(overlay) - Overlay content wrapper
-
vaadin-context-menu-overlay
::part(content)
Items
- Item element
-
vaadin-context-menu-item
- Item content wrapper
-
vaadin-context-menu-item
::part(content) - Item selection indicator
-
vaadin-context-menu-item
::part(checkmark) - Item selection indicator icon
-
vaadin-context-menu-item
::part(checkmark)::before - Submenu indicator icon
-
vaadin-context-menu-item
::after - Separator
-
vaadin-context-menu-overlay
[role="separator"]
Item States
- Selected item
-
vaadin-context-menu-item
[selected] - Focused item
-
vaadin-context-menu-item
[focused] - Hovered item
-
vaadin-context-menu-item
:hover - Pressed item
-
vaadin-context-menu-item
[active] - Disabled item
-
vaadin-context-menu-item
[disabled] - Item with a nested sub-menu
-
vaadin-context-menu-item
[aria-haspopup] - Item with expanded sub-menu
-
vaadin-context-menu-item
[expanded]