SharpRSS/WebSharpRSS/MainLayout.razor

@inherits LayoutComponentBase

<MudThemeProvider @bind-IsDarkMode="@_darkTheme" Theme="_mainTheme"/>
<MudDialogProvider/>
<MudSnackbarProvider/>
<style>
    .blur_transparency {
        backdrop-filter: blur(16px) saturate(180%);
        background: rgba(0,0,0,0.3);
    }
    .layout_image{
    background-image: url('http://s1.picswalls.com/wallpapers/2016/06/10/best-4k-wallpaper_065236736_309.jpg');
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    }
</style>

<MudLayout>
    <MudAppBar Class="blur_transparency">
        <MudIconButton Icon="@Icons.Material.Filled.Menu" Color="Color.Inherit" Edge="Edge.Start" OnClick="@((e) => DrawerToggle())"/>
        <MudText Typo="Typo.h6">SharpRSS</MudText>
        <MudSpacer/>
        <MudToggleIconButton @bind-Toggled="@_darkTheme" Icon="@Icons.Material.Filled.LightMode" ToggledIcon="@Icons.Material.Filled.DarkMode"></MudToggleIconButton>
        <MudIconButton Icon="@Icons.Custom.Brands.GitHub" Href="https://github.com/hmaxnl/SharpRSS" Target="_blank"></MudIconButton>
    </MudAppBar>
    <MudDrawer @bind-Open="@_drawerOpen" ClipMode="DrawerClipMode.Always">
        <SideGuide/>
    </MudDrawer>
    <MudMainContent>
        @Body
    </MudMainContent>
</MudLayout>

@code {
    readonly MudTheme _mainTheme = new MudTheme();
    bool _darkTheme = true;
    bool _drawerOpen = true;

    void DrawerToggle()
    {
        _drawerOpen = !_drawerOpen;
    }
}