@page "/"
<MatAppBar Fixed="true" Style="z-index: 100;" Class="mat">
<MatAppBarRow>
<MatAppBarSection>
<MatIconButton Icon="menu" OnClick="@((e) => ButtonClicked())"></MatIconButton>
<MatAppBarTitle>MatBlazor - Material Design components for Blazor</MatAppBarTitle>
</MatAppBarSection>
<MatAppBarSection Align="@MatAppBarSectionAlign.End">
<MatIcon Icon="favorite"></MatIcon>
</MatAppBarSection>
</MatAppBarRow>
</MatAppBar>
<MatDrawerContainer Style="width: 100vw; height: 100vh;">
<MatHidden Breakpoint="@MatBreakpoint.SM" Direction="@MatHiddenDirection.Up">
<ChildContent>
<MatDrawer @bind-Opened="@Opened" Mode="@MatDrawerMode.Modal">
<MatAppBarAdjust></MatAppBarAdjust>
Drawer Content
</MatDrawer>
</ChildContent>
<ElseContent>
<MatDrawer @bind-Opened="@Opened" Mode="@MatDrawerMode.Dismissible">
<MatAppBarAdjust></MatAppBarAdjust>
Drawer Content
</MatDrawer>
</ElseContent>
</MatHidden>
<MatDrawerContent>
<MatAppBarAdjust></MatAppBarAdjust>
<p>Page Content</p>
</MatDrawerContent>
</MatDrawerContainer>
@code
{
bool Opened = true;
void ButtonClicked()
{
Opened = !Opened;
}
}