Top Bar

Namespace

using Blazor_Foundation_6.Components.Navigation;

Attributes

TopBarWrapper

NameDescription
IdDefault html id=”” attribute.
ClassExtra/Custom Classes appended to the default class.
StyleHTML style…
StickyTrue/False. True when stick topbar.
AutoManagedTrue/False. Blazor will auto manage Foundation Zurb’s Javascript.
DataOptionsCan include any option available for sticky only. (See Plugin Options)

TopBarRight/TopBarLeft

Note: GridX has Horizontal Content Direction and GridY has vertical direction.

NameDescription
IdDefault html id=”” attribute.
ClassExtra/Custom Classes appended to the default class.
StyleHTML style…
StickyWrapperMust be True if TopBarWrapper: Sticky = true.

Note: Sticky version utilize the plugin: sticky.

Examples

To see visual example, visit Foundation or Download and Run Blazor_Foundation_Test in Visual Studio.

<TopBarWrapper Sticky="true" Id="TopBarMenu">
    <TopBarLeft StickyWrapper="true">
        <Menu id="MenuDropDownTest" HasDropdown="true">
            <li>
                <a>Menu One</a>
                <Menu>
                    <li>
                        <a>Dropdown A</a>
                    </li>
                </Menu>
            </li>
            <li><a>Menu Two</a></li>
            <li><a>Menu Three</a></li>
            <li><a>Menu Four</a></li>
        </Menu>
    </TopBarLeft>
</TopBarWrapper>