Site Header#

Properties

Subheader

Border

Fixed

Color Scheme

Props#

SiteHeader

Props

nametypedefaultdescription

SiteHeaderLogo

Props

nametypedefaultdescription

SiteHeaderMenu

Props

nametypedefaultdescription

SiteHeaderMobileMenu

Props

nametypedefaultdescription

Utilities#

SiteHeaderMenu.useButtonStyle#

The hook is a method to get consistent menu item styles.

const clsBtnP1 = SiteHeaderMenu.useButtonStyle({ prominance: 1 });

The hook accepts an object of optional prominance (number) and colorScheme (light, dark, auto).

The hook reads the existing SiteHeader props context in order to provide a default to colorScheme.

Examples#

Logo only#

When there is only one child in the children prop, the CSS property justify-content will be set to center.

Add a secondary header (or any other content)#

#