<PrimerBrandSubdomainNavBar LogoImgSrc="/images/logo_small.png"
LogoWidth="32"
LogoHeight="32"
Title="Subdomain"
BackHref="https://primerblazor.com"
HomeHref="/"
ShowBackArrow="true"
MenuItems="@NavLinks"
PrimaryCtaText="Primary CTA"
PrimaryCtaHref="#"
SecondaryCtaText="Secondary CTA"
SecondaryCtaHref="#" />
Available options for PrimerBrandSubdomainNavBar
Name | Description | Default Value | CSS Class |
---|---|---|---|
Title | The title shown in the navbar | Subdomain | SubdomainNavBar-title |
BackHref | URL for the logo mark | / | SubdomainNavBar-logo-mark |
HomeHref | URL for the title text link | / | SubdomainNavBar-title |
LogoImgSrc | Image path for the brand logo (replaces PrimerBrandIcon) | null | SubdomainNavBar-logo-mark |
LogoWidth | Width of the logo image in pixels | 24 | SubdomainNavBar-logo-mark |
LogoHeight | Height of the logo image in pixels | 24 | SubdomainNavBar-logo-mark |
LogoAlt | Alternative text for the logo image | "Brand Logo" | SubdomainNavBar-logo-mark |
ShowLogo | Whether to display the logo (required for ShowBackArrow to have effect) | true | SubdomainNavBar-logo-mark |
ShowBackArrow | Whether to show a left arrow before the logo (only if ShowLogo is true) | true | SubdomainNavBar-back-arrow |
ShowTitle | Whether to display the title text | true | SubdomainNavBar-title |
ShowSeparator | Whether to display the '/' separator between logo and title | true | SubdomainNavBar-title-separator |
MenuItems | Main navigation links (with optional dropdown) | [] | SubdomainNavBar-primary-nav |
PrimaryCtaText | Label for the primary CTA button | null | SubdomainNavBar-cta-button |
PrimaryCtaHref | URL for the primary CTA button | null | SubdomainNavBar-cta-button |
SecondaryCtaText | Label for the secondary CTA button | null | SubdomainNavBar-cta-button--secondary |
SecondaryCtaHref | URL for the secondary CTA button | null | SubdomainNavBar-cta-button--secondary |
SearchEnabled | Enables a built-in search field | false | SubdomainNavBar-search-trigger |
OnSearch | Callback triggered when the search is submitted | null | - |
private List<NavLinkItem> NavLinks = new()
{
new() { Text = "Collections", Href = "#" },
new() { Text = "Topics", Href = "#" },
new() { Text = "Articles", Href = "#" },
new() { Text = "Events", Href = "#" },
new()
{
Text = "More",
Children = new List<NavLinkItem>
{
new() { Text = "Video", Href = "#" },
new() { Text = "Social", Href = "#" }
}
}
};