A notification bar provides contextual feedback messages.

Tips

  • The message should be short, usually a single sentence.
  • The bar can include an optional button to dismiss the notification.
  • If the message needs to include a prominent action link, you can use the class mzp-c-notification-bar-cta to make the link stand out.

Notification bars have a few different styles to indicate different types of messages:

  • mzp-t-success
  • mzp-t-warning
  • mzp-t-error
  • mzp-t-click
<aside class="mzp-c-notification-bar">
    <p>Generic notification.</p>
</aside>