Alert

<div role="alert" class="alert alert-warning d-flex shadow-sm align-items-center">
  <div class="bi bi-exclamation-triangle-fill fs-3 me-3 align-self-center
              d-flex justify-content-center"></div>
  <div class="text-body">
    <div class="fw-semibold">Warning</div>
    <div>Alert text</div>
    <div>
      <a href="#"><i class="bi bi-box-arrow-up-right me-1"></i>Link</a>
    </div>
  </div>
</div>

Dimissable Alert

  <div class="alert alert-warning alert-dismissible shadow-sm d-flex align-items-center">
  <i class="bi bi-exclamation-triangle-fill fs-3 me-3"></i>
  <div class="text-body">
    <div class="fw-semibold">Warning</div>
    <div>Warning text</div>
    <div>
      <a href="#"><i class="bi bi-box-arrow-up-right me-1"></i>Link</a>
    </div>
  </div>
  <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>