Skip to main content

LgThemeMenuItem

LgThemeMenuItem is a ready-to-use menu entry that opens the theme selector in a small modal window. The selector displays a button for each theme declared by the application; the chosen theme is applied immediately and remembered in the browser.

MenuConfiguration.razor
<LgMenu>
…
<LgThemeMenuItem />
</LgMenu>
Themes must be declared

The framework provides no ready-to-use themes (no built-in light/dark mode). The available themes are those declared by the application: one per theme-<name>.scss file in the client project, with the translation key theme-<name> as the button label. Without any declared theme, the selector is empty; see Themes and styles.

To display the entry only when there is a choice to make, test the list of themes:

MenuConfiguration.razor
@if (App.Themes.Count > 1)
{
<LgThemeMenuItem />
}

The component inherits from LgMenuItem and adds no specific parameters. It sets Link (the selector page, route themes) and Modal (ModalSize.Small). The label ("Theme selector") and icon come from this link; Text and IconName allow you to replace them, and the other LgMenuItem parameters remain available.

See also​

  • Themes and styles — declaring themes, default theme, changing theme by code.
  • LgMenuItem — the generic menu entry.
  • Application menu configuration: Menu.