A classname to apply to an element that should be offset either with padding or margin by the height of a normal App Bar.
A classname to apply to an element that should be offset either with padding or margin by the height of a dense App Bar.
A classname to apply to an element that should be offset either with padding or margin by the height of a prominent App Bar.
A classname to apply to an element that should be offset either with padding or margin by the height of a prominent and dense App Bar.
This component is used to create a top-level app bar in your application that
can be used to contain a navigation menu toggle button, the app's logo and/or
title, as well as any top-level actions that will be reused throughout your
app. When using this component with the fixed prop, it is recommended to
also use one of the "offset class names" so that your content will not be
converted by the app bar. You can also use any of the exposed mixins to add
these offsets as well.
This component is really just a simple wrapper for the Button component
that adds a few additional styles to prevent the button from shrinking when
an AppBar has a lot of content. It also will automatically add spacing
either before or after this button when the first or last props are
provided.
This component is really just a simple wrapper for the Button component
that adds some additional styles for adding spacing before and after this
button so that it aligns to the main "keyline" of your application's
navigation. In simpler terms, it will make the left side of the icon in this
button aligns with all the other icons that appear in ListItems in your
main navigation.
This component is generally really only used when you want to have a temporary navigation element like a hamburger menu.
This component is used to create a title for your application. If your app is
not using the AppBarNav component, you can enable the keyline prop to
ensure that your title aligns with the keyline of your navigation element.
This is a hook that will apply the nav classnames to an element. This should really not be used externally and is really just for creating dropdown menus within app bars that have the action styles.
Generated using TypeDoc
AppBars have multiple heights available:"none"- the height is derived by thechildrenof theAppBar"normal"- the height is set to a static height of$rmd-app-bar-height"prominent"- the height is set to a static height of$rmd-app-bar-prominent-height"dense"- the height is set to a static height of$rmd-app-bar-dense-height."prominent-dense"- the height is set to a static height of$rmd-app-bar-prominent-dense-heightNote: The
"dense"specs can automatically be enabled with thermd-app-bar-dense-thememixin instead of changing this valueYou'll normally want to use the
"normal"or"prominent"height values for your app, but the"none"value is useful if you want to use theAppBarfor styling purposes only for other components likeTabs.