We will be updating this content to our new principle-based format in the near future.
A simple banner to indicate the phase of the project.
The Phase Banner is an indicator that sits at the top of your application. It communicates the current phase of the project to show it is still being worked on.
Phase Badge. The Phase Badge indicates the current phase to the user.
Phase Message. Accompanying message to provide additional information to the user.
Container. The container is a wrapper that stretches to 100% of the viewport.
2Sizing & Spacing
The phase banner is a full-width component - it is designed to stretch to the size of the viewport. Try to keep the Phase Message concise.
3Hierarchy & Placement
There should be only one Phase Banner per page. Its placement should be at the top of the viewport, underneath the main Masthead.