work/Visor/Visor/Components/Layout/TopMenu.razor

@using Blazorise.Localization

<Bar @bind-Visible="@topbarVisible" Breakpoint="Breakpoint.Desktop" Background="Background.Primary" ThemeContrast="ThemeContrast.Light">
    <BarBrand>
        <BarItem>
            <BarLink To="">
                <BarIcon Margin="Margin.Is2.FromEnd" IconName="IconName.Dashboard" />
                Visor
            </BarLink>
        </BarItem>
    </BarBrand>
    <BarToggler />
    <BarMenu>
        <BarStart>
            <BarItem>
                <BarLink To="/">Home</BarLink>
            </BarItem>
            <BarItem>
                <BarLink To="https://blazorise.com/docs/">Documentation</BarLink>
            </BarItem>
            <BarItem>
                <BarDropdown>
                    <BarDropdownToggle>More</BarDropdownToggle>
                    <BarDropdownMenu>
                        <BarDropdownItem To="https://blazorise.com/docs/start/">
                            Quick-Start Guide
                        </BarDropdownItem>
                        <BarDropdownDivider />
                        <BarDropdownItem To="https://blazorise.com/docs/usage/">
                            Usage
                        </BarDropdownItem>
                    </BarDropdownMenu>
                </BarDropdown>
            </BarItem>
            <BarItem>
                <BarDropdown>
                    <BarDropdownToggle>Layout</BarDropdownToggle>
                    <BarDropdownMenu>
                        <BarDropdownItem Clicked="@(()=>OnLayoutTypeChecked("fixed-header"))">
                            @if ( LayoutType == "fixed-header" )
                            {
                                <Icon Name="IconName.CheckCircle" TextColor="TextColor.Success" />
                            }
                            Fixed Header
                        </BarDropdownItem>
                        <BarDropdownItem Clicked="@(()=>OnLayoutTypeChecked("fixed-header-footer-only"))">
                            @if ( LayoutType == "fixed-header-footer-only" )
                            {
                                <Icon Name="IconName.CheckCircle" TextColor="TextColor.Success" />
                            }
                            Fixed Header and Footer only
                        </BarDropdownItem>
                        <BarDropdownItem Clicked="@(()=>OnLayoutTypeChecked("sider-with-header-on-top"))">
                            @if ( LayoutType == "sider-with-header-on-top" )
                            {
                                <Icon Name="IconName.CheckCircle" TextColor="TextColor.Success" />
                            }
                            Sider with Header on top
                        </BarDropdownItem>
                    </BarDropdownMenu>
                </BarDropdown>
            </BarItem>


        </BarStart>
        <BarEnd>
            <BarItem>
                <BarDropdown RightAligned>
                    <BarDropdownToggle><Icon Name="IconName.Language" /></BarDropdownToggle>
                    <BarDropdownMenu>
                        @foreach ( var cultureInfo in LocalizationService!.AvailableCultures )
                        {
                            <BarDropdownItem @key="@cultureInfo.Name" Clicked="@(()=>SelectCulture(cultureInfo.Name))">
                                @if ( cultureInfo.IsNeutralCulture )
                                {
                                    @cultureInfo.EnglishName
                                }
                                else
                                {
                                    @cultureInfo.Parent.EnglishName
                                }
                            </BarDropdownItem>
                        }
                    </BarDropdownMenu>
                </BarDropdown>
            </BarItem>
            <BarItem>
                <BarDropdown RightAligned>
                    <BarDropdownToggle><Icon Name="IconName.Tint" /> Theme</BarDropdownToggle>
                    <BarDropdownMenu Style="padding: 15px; min-width:550px;">
                        <Row>
                            <Column Margin="Margin.Is2.FromBottom">
                                <Field>
                                    <Switch TValue="bool" Value="@(Theme?.Enabled == true)" ValueChanged="@ThemeEnabledChanged">Theme enabled</Switch>
                                </Field>
                            </Column>
                        </Row>
                        <Row>
                            <Column Margin="Margin.Is2.FromBottom">
                                <Field>
                                    <Check TValue="bool" Value="@(Theme?.IsGradient == true)" ValueChanged="@ThemeGradientChanged">Gradient colors</Check>
                                </Field>
                                <Field>
                                    <Check TValue="bool" Value="@(Theme?.IsRounded == true)" ValueChanged="@ThemeRoundedChanged">Rounded elements</Check>
                                </Field>
                            </Column>
                        </Row>
                        <Row>
                            <Column>
                                <Container Fluid>
                                    <ThemeColorSelector Value="@(Theme?.ColorOptions?.Primary)" ValueChanged="@ThemeColorChanged"></ThemeColorSelector>
                                </Container>
                            </Column>
                        </Row>
                    </BarDropdownMenu>
                </BarDropdown>
            </BarItem>
            <BarItem>
                <BarLink To="https://github.com/Megabit/Blazorise">GitHub</BarLink>
            </BarItem>
        </BarEnd>
    </BarMenu>
</Bar>
@code {
    protected override async Task OnInitializedAsync()
    {
        await SelectCulture( "en-US" );

        await base.OnInitializedAsync();
    }

    Task SelectCulture( string name )
    {
        LocalizationService!.ChangeLanguage( name );

        return Task.CompletedTask;
    }

    private bool topbarVisible = false;

    Task OnLayoutTypeChecked( string layoutType )
    {
        LayoutType = layoutType;

        return LayoutTypeChanged.InvokeAsync( layoutType );
    }

    [Parameter] public EventCallback<bool> ThemeEnabledChanged { get; set; }

    [Parameter] public EventCallback<bool> ThemeGradientChanged { get; set; }

    [Parameter] public EventCallback<bool> ThemeRoundedChanged { get; set; }

    [Parameter] public EventCallback<string> ThemeColorChanged { get; set; }

    [Parameter] public string? LayoutType { get; set; }

    [Parameter] public EventCallback<string> LayoutTypeChanged { get; set; }

    [Inject] protected ITextLocalizerService? LocalizationService { get; set; }

    [CascadingParameter] protected Theme? Theme { get; set; }
}