ui/components/menuoption.razor.scss
@import "/UI/Theme.scss";

MenuOption
{
	flex-direction: row;
	padding: 2px 6px;
	border-radius: 5px;
	color: #8ad;

	&:not(.disabled)
	{
		cursor: pointer;

		:hover
		{
			color: white;
			sound-in: ui.hover;
		}

		:active
		{
			color: $menu-text-strong;
			background-color: $menu-accent-soft;
			sound-in: ui.select;
		}

		&.active
		{
			color: white;
			background-color: $menu-accent;
		}
	}
}

.iconpanel
{
	width: 24px;
}

Label
{
	text-overflow: ellipsis;
}

MenuOption.disabled
{
	color: rgba( white, 0.3 );
	pointer-events: none;
}