@page "/"
@using MatBlazor
@inject HttpClient http
@inherits LayoutComponentBase
<MatThemeProvider Theme="@theme">
<MatDrawerContainer Style="width: 100vw; height: 100vh;">
<MatDrawer @bind-Opened="@Opened" Mode="@MatDrawerMode.Modal">
<ul class="nav flex-column">
<li class="nav-item px-3">
<NavLink class="nav-link" href="/">
<span class="oi oi-plus" aria-hidden="true"></span> Login
</NavLink>
</li>
<li class="nav-item px-3">
<NavLink class="nav-link" href="weather">
<span class="oi oi-list-rich" aria-hidden="true"></span> Fetch data
</NavLink>
</li>
</ul>
</MatDrawer>
<MatDrawerContent>
<div>
<MatButton OnClick="@((e) => ButtonClicked())">Open Menu</MatButton>
</div>
<p>Opened: @Opened</p>
@Body
</MatDrawerContent>
</MatDrawerContainer>
</MatThemeProvider>
@code
{
MatTheme theme = new MatTheme()
{
Primary = "#0071BC",
Secondary = "#048c26"
};
bool Opened = false;
void ButtonClicked()
{
Opened = !Opened;
}
}