Alert
Example Code
<div class="success alert">
<p class="alert-title">Profile Updated</p>
<p>
Please note that it may take up to 24 hours for everyone
to see your changes.
</p>
</div>Result
Profile Updated
Please note that it may take up to 24 hours for everyone to see your changes.
Options
Status
To set the status of an alert, add one of the following classes:
infosuccesswarningerror
This is an info alert.
This is a success alert.
This is a warning alert.
This is an error alert.
Title
To add a title to the alert, add an element with the class alert-title as the first child.
Fun Fact
The tip of a shoelace is called an aglet.
Banner
An alert can be used as a banner by adding the class banner. This is intended to be used for site-wide messages and should be placed
at the top of the page. You can add a button with the class dismiss to allow users to close the banner.