Alerts

Alert
Ex. <div class="alert alert-primary" role="alert"> A simple primary alert—check it out! </div>
Alert with Icons
Ex. <div class="alert bg-soft-primary fw-medium" role="alert"> <i class="uil uil-info-circle fs-5 align-middle me-1"></i> An example alert with an icon </div>
Alert Links
Ex. <div class="alert alert-primary" role="alert"> A simple primary alert with <a href="#" class="alert-link"></a>. </div>
Additional Content
Dismissing Alert
Ex.
<div class="alert alert-success alert-dismissible fade show" role="alert">
  <strong>Well done!</strong> You successfully read this important alert message.
  <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"> </button>
</div>
Advanced Alert
Ex.
<div class="alert alert-primary alert-pills" role="alert">
   <span class="badge rounded-pill bg-danger"> New </span>
   <span class="alert-content"> A Modern primary alert—check it out! </span>
</div>
Advanced Outline Alert
Ex.
<div class="alert alert-outline-primary alert-pills" role="alert">
   <span class="badge rounded-pill bg-danger"> New </span>
   <span class="alert-content"> A Modern primary alert—check it out! </span>
</div>

Login