Design system

App bar

The App Bar displays information and actions relating to the current screen.

Bundle size: 578 Bytes
Install:
npm install @washingtonpost/wpds-app-bar
|Copy
Usage:
import { AppBar } from "@washingtonpost/wpds-app-bar"
|Copy

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

PropTypeDefaultRequired
position
enum
fixed | sticky | absolute | relative
----False
shadow
enum
boolean | true
----False