Anatomy
The anatomy of an app bar has no visual elements but rather is an empty container that has a built-in utility to make positioning on a layout easier.
Options
Position
The following position are available sticky relative absolute fixed. The behavior of the different options are described in the MDN web docs.
API Reference
AppBar
| Prop | Description | Type | Default | Required |
|---|---|---|---|---|
| position | App bar's position in time and space | enum fixed | sticky | absolute | relative | ---- | False |
| shadow | App bar's shadow in time and space | enum boolean | true | ---- | False |
| as | WPDS provides an as prop for changing which tag a component outputs. | never | ---- | False |
| css | WPDS provides a css prop for overriding styles easily. It’s like the style attribute, but it supports tokens, media queries, nesting and token-aware values. All WPDS Components include a css prop. Use it to pass in overrides. | CSS<{ sm: `(max-width: calc(${string} - 1px))`; md: `(min-width: ${string}) and (max-width: calc(${string} - 1px))`; lg: `(min-width: ${string}) and (max-width: calc(${string} - 1px))`; xl: `(min-width: ${string}) and (max-width: calc(${string} - 1px))`; xxl: `(min-width: ${string}) and (max-width: ${string})`; notS... | ---- | False |