Blazor MudBlazor

<MudScrollToTop>
    <MudFab Color="Color.Tertiary" Icon="@Icons.Filled.ArrowCircleUp" />
</MudScrollToTop>

<MudThemeProvider @bind-IsDarkMode="@_isDarkMode" Theme="_theme"/>
<MudSwitch @bind-Checked="@_isDarkMode" Color="Color.Primary" Class="ma-4" T="bool" Label="Light/Dark"/>

@code{
    private MudTheme _theme = new();
    private bool _isDarkMode =true;
}

@inherits LayoutComponentBase

<MudThemeProvider />
<MudDialogProvider />
<MudSnackbarProvider />

<MudLayout>
    <MudAppBar Elevation="0">
        <MudIconButton Icon="@Icons.Material.Filled.Menu" Color="Color.Inherit" Edge="Edge.Start" OnClick="@((e) => DrawerToggle())" />
        <MudSpacer />

        <MudThemeProvider @bind-IsDarkMode="@_isDarkMode" Theme="_theme"/>
        <MudSwitch @bind-Checked="@_isDarkMode" Color="Color.Primary" Class="ma-4" T="bool" Label="Light/Dark"/>
        <MudIconButton Icon="@Icons.Custom.Brands.MudBlazor" Color="Color.Inherit" Link="https://mudblazor.com/" Target="_blank" />
        <MudIconButton Icon="@Icons.Custom.Brands.GitHub" Color="Color.Inherit" Link="https://github.com/MudBlazor/MudBlazor/" Target="_blank" />
    </MudAppBar>
    <MudDrawer @bind-Open="_drawerOpen" Elevation="1">
        <MudDrawerHeader>
            <MudText Typo="Typo.h6">BlazorMarkdown</MudText>
        </MudDrawerHeader>
        <NavMenu />
    </MudDrawer>
    <MudMainContent>
        <MudContainer MaxWidth="MaxWidth.Large" Class="my-16 pt-16">
            @Body
        </MudContainer>
    </MudMainContent>
</MudLayout>



@code {
    bool _drawerOpen = true;

    void DrawerToggle()
    {
        _drawerOpen = !_drawerOpen;
    }

    private bool _isDarkMode =true;

	private MudTheme _theme = new()
		{
			Typography = new Typography()
			{
				Default = new Default()
				{
					FontFamily = new[] { "Helvetica Neue",
					"Arial",
					"Hiragino Kaku Gothic ProN",
					"Hiragino Sans",
					"Meiryo",
					"sans-serif" }
				},
				H1 = new H1()
				{
					FontSize = "2.5rem",
					FontWeight = 700
				},
				H2 = new H2()
				{
					FontSize = "2rem",
					FontWeight = 700
				},
				H3 = new H3()
				{
					FontSize = "1.75rem",
					FontWeight = 700
				},
				H4 = new H4()
				{
					FontSize = "1.5rem",
					FontWeight = 700
				},
				H5 = new H5()
				{
					FontSize = "1.25rem",
					FontWeight = 700
				},
				H6 = new H6()
				{
					FontSize = "1rem",
					FontWeight = 700
				}
			}
		};
 
}

.....
    <script src="https://code.jquery.com/jquery-3.4.1.js"></script>
    <script>
         SetupScrollAnchor = ()=> {
            $('a[href^="#"]').click(function () {
                var speed = 500;
                var href = $(this).attr("href");
                var target = $(href == "#" || href == "" ? 'html' : href);
                var position = target.offset().top;
                $("html, body").animate({ scrollTop: position }, speed, "swing");
                return false;
            });
        };
    </script>
</body>
</html>

@page "/"
@inject IJSRuntime JSRuntime;

.....

@code
{

.....

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        await JSRuntime.InvokeVoidAsync("SetupScrollAnchor");
    }
}