@inherits LayoutComponentBase

<MudThemeProvider Theme="_theme" />
<MudPopoverProvider />
<MudDialogProvider />
<MudSnackbarProvider />

<MudLayout Class="porcelain-app">
    <MudAppBar Class="porcelain-appbar" Elevation="0" Dense="true">
        <MudButton Href="/" Class="brand-button" Variant="Variant.Text" Color="Color.Inherit" StartIcon="@Icons.Material.Filled.MusicNote">
            洛星瓷歌单
        </MudButton>
        <MudSpacer />
        <MudHidden Breakpoint="Breakpoint.SmAndDown">
            <MudButton Href="/" Variant="Variant.Text" Color="Color.Inherit" StartIcon="@Icons.Material.Filled.Search">
                搜歌
            </MudButton>
            <AuthorizeView>
                <Authorized>
                    <MudButton Href="/admin" Variant="Variant.Text" Color="Color.Inherit" StartIcon="@Icons.Material.Filled.AdminPanelSettings">
                        管理
                    </MudButton>
                    <MudButton Href="/admin/logout" Variant="Variant.Text" Color="Color.Inherit" StartIcon="@Icons.Material.Filled.Logout">
                        退出
                    </MudButton>
                </Authorized>
                <NotAuthorized>
                    <MudButton Href="/admin/login" Variant="Variant.Text" Color="Color.Inherit" StartIcon="@Icons.Material.Filled.Login">
                        管理登录
                    </MudButton>
                </NotAuthorized>
            </AuthorizeView>
        </MudHidden>
        <MudHidden Breakpoint="Breakpoint.MdAndUp">
            <MudMenu Icon="@Icons.Material.Filled.Menu" Color="Color.Inherit" Dense="true">
                <MudMenuItem Href="/" Icon="@Icons.Material.Filled.Search">搜歌</MudMenuItem>
                <AuthorizeView>
                    <Authorized>
                        <MudMenuItem Href="/admin" Icon="@Icons.Material.Filled.AdminPanelSettings">管理</MudMenuItem>
                        <MudMenuItem Href="/admin/logout" Icon="@Icons.Material.Filled.Logout">退出</MudMenuItem>
                    </Authorized>
                    <NotAuthorized>
                        <MudMenuItem Href="/admin/login" Icon="@Icons.Material.Filled.Login">管理登录</MudMenuItem>
                    </NotAuthorized>
                </AuthorizeView>
            </MudMenu>
        </MudHidden>
    </MudAppBar>
    <MudMainContent Class="porcelain-main">
        <div class="decor decor-a"></div>
        <div class="decor decor-b"></div>
        <div class="content-shell">
            @Body
        </div>
    </MudMainContent>
</MudLayout>

<div id="blazor-error-ui" data-nosnippet>
    An unhandled error has occurred.
    <a href="." class="reload">Reload</a>
    <span class="dismiss">🗙</span>
</div>

@code {
    private readonly MudTheme _theme = new()
    {
        PaletteLight = new PaletteLight
        {
            Primary = "#5b8ecf",
            Secondary = "#9fd8ec",
            Tertiary = "#d8edf7",
            AppbarBackground = "rgba(248, 252, 255, 0.78)",
            AppbarText = "#214a72",
            Background = "#f6fbff",
            Surface = "rgba(255, 255, 255, 0.86)",
            DrawerBackground = "#f8fcff",
            TextPrimary = "#18344f",
            TextSecondary = "#55718c",
            Info = "#6baed6",
            Success = "#4ea38c",
            Warning = "#d89a42",
            Error = "#c9566a"
        },
        LayoutProperties = new LayoutProperties
        {
            DefaultBorderRadius = "8px"
        },
        Typography = new Typography
        {
            Default = new DefaultTypography
            {
                FontFamily = ["Inter", "Noto Sans SC", "Microsoft YaHei", "sans-serif"]
            },
            H1 = new H1Typography { FontWeight = "700" },
            H2 = new H2Typography { FontWeight = "700" },
            H3 = new H3Typography { FontWeight = "700" }
        }
    };
}