main layout

10 months ago · 9cdd37c5e3
parent b0ee44ccd1
commit 9cdd37c5e3
2 changed files with 29 additions and 0 deletions
--- a/BlazorFluentUI/Components/Layout/NavMenu.razor
+++ b/BlazorFluentUI/Components/Layout/NavMenu.razor
@ -16,6 +16,7 @@
                <FluentNavLink Href="layoutbodycontent" Icon="@(new Icons.Regular.Size20.ContentViewGallery())" IconColor="Color.Accent">BodyContent</FluentNavLink>
                <FluentNavLink Href="layoutgrid" Icon="@(new Icons.Regular.Size20.Grid())" IconColor="Color.Accent">Grid</FluentNavLink>
                <FluentNavLink Href="layoutlayout" Icon="@(new Icons.Regular.Size20.LayoutColumnOneThirdLeft())" IconColor="Color.Accent">Layout</FluentNavLink>
                <FluentNavLink Href="layoutmainlayout" Icon="@(new Icons.Regular.Size20.LayoutColumnTwoSplitRight())" IconColor="Color.Accent">MainLayout</FluentNavLink>
            </FluentNavGroup>
        </FluentNavMenu>
    </nav>
--- a/BlazorFluentUI/Components/Pages/LayoutMainLayout.razor
+++ b/BlazorFluentUI/Components/Pages/LayoutMainLayout.razor
@ -0,0 +1,28 @@
@page "/layoutmainlayout"
@rendermode RenderMode.InteractiveServer
 <FluentLabel Typo="Typography.H3">Layout</FluentLabel>
 <FluentDivider class="mt-1 mb-3" Role="DividerRole.Separator" />
 <FluentLabel Typo="Typography.Body">
    The <code>FluentMainLayout</code> component offers a framework for a layout of a page in a site
 </FluentLabel>
 <FluentCard Width="auto" Height="300px">
    <FluentMainLayout class="mt-3" NavMenuTitle="Navigation menu">
        <Header><h3>Fluent UI Component</h3></Header>
        <SubHeader><p>A subheader here</p></SubHeader>
        <Body>
            Lorem ipsum...
        </Body>
        <NavMenuContent>
            <FluentNavLink Icon="@(new Icons.Regular.Size24.Home())" Href="/">Home</FluentNavLink>
        </NavMenuContent>
    </FluentMainLayout>
 </FluentCard>
@code {
    bool showHeader = true;
    bool showNavMenu = true;
    bool showBodyContent = true;
    bool showFooter = true;
 }