Alerts

Heads Up! Components & docs are subject to change until official v1.0 release. ×

Pro Tip: Try Hitting Refresh! ×

Success! Data Saved. ×

Warning! Data Storage Limited. ×

Danger! Something went horribly wrong. Application will self destruct in 1min... ×

<div class="alert">
  <strong>Pro Tip:</strong> Try Hitting Refresh!
  <a href="#" class="alert__close" data-alert-close>&times;</a>
</div>

<div class="alert alert--info">
  <strong>Pro Tip:</strong> Try Hitting Refresh!
  <a href="#" class="alert__close" data-alert-close>&times;</a>
</div>

<div class="alert alert--success">
  <strong>Success!</strong> Data Saved.
  <a href="#" class="alert__close" data-alert-close>&times;</a>
</div>

<div class="alert alert--warning">
  <strong>Warning!</strong> Data Storage Limited.
  <a href="#" class="alert__close" data-alert-close>&times;</a>
</div>

<div class="alert alert--danger">
  <strong>Danger!</strong> Something went horribly wrong. Application will self destruct in 1min...
  <a href="#" class="alert__close" data-alert-close>&times;</a>
</div>

Documentation