Notification

.p-notification

Notifications are used to display global information. A notification will display at the top and fill the full width of the page. A notification can be a default, caution, negative or position.

View example of the default notification pattern

.p-notification--caution

This caution variant should be used to convey information that is not critical but the user should be aware of.

View example of the caution notification pattern

.p-notification--negative

This negative variant should be used to convey information that is critical and the user should take action.

View example of the negative notification pattern

.p-notification--positive

This positive variant should be used to convey success or completion.

View example of the positive notification pattern

.p-notification--information

This information variant should be used to convey an information message.

View example of the information notification pattern

Adding actions

Notifications have the ability to add an action link to them. These should appear inline with the notification response and will add margin between the link and content.

Note: All functionality must be developed in independently.

View example of the caution notification pattern