Toolbar
The Toolbar component is pivotal to any graphical user interface (GUI), as it generally is the primary source of site navigation. The toolbar component works great in conjunction with NavigationDrawer and Card.
info
Props
Attribute | Description | Type | Default |
---|---|---|---|
class | Allows custom properties to take effect. | string | undefined |
dark | Applies the dark theme. | boolean | false |
absolute | Applies position: absolute to the component. | boolean | false |
bottom | Aligns the component towards the bottom. | boolean | false |
collapse | Puts the toolbar into a collapsed state reducing its maximum width. | boolean | false |
color | Applies specified color. | string | undefined |
dense | Reduces the height of the toolbar content to 48px. | boolean | false |
elevation | Designates an elevation applied to the component between 0 and 24. | number | 0 |
extended | Use this prop to increase the height of the toolbar without using the extension slot for adding content. | boolean | false |
floating | Applies display: inline-flex to the component. | boolean | false |
prominent | Increases the height of the toolbar content to 128px. | boolean | false |
short | Reduce the height of the toolbar content to 56px. | boolean | false |
src | Specifies a Image as the component’s background. | string | undefined |
tile | Removes the component’s border-radius. | boolean | false |
tag | pecify a custom tag used on the root element. | string | header |
visible | Visibility of Toolbar component. | boolean | true |