@themesberg/pixel-lite-bootstrap-ui-kit
Version:
Open-source Bootstrap 5 UI Kit
49 lines • 2.38 kB
HTML
<!-- Section -->
<div class="section section-md">
<div class="container">
<div class="row">
<div class="col-md-6 col-lg-4 mb-4">
<div class="toast fade show" role="alert" aria-live="assertive" aria-atomic="true">
<div class="toast-header">
<span class="fab fa-bootstrap me-2"></span>
<strong class="me-auto">Themesberg</strong>
<small>11 mins ago</small>
<button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
<div class="toast-body">
Hello, world! This is a toast message.
</div>
</div>
</div>
<div class="col-md-6 col-lg-4 mb-4">
<div class="toast bg-primary text-white fade show" role="alert" aria-live="assertive"
aria-atomic="true">
<div class="toast-header">
<span class="fab fa-bootstrap me-2"></span>
<strong class="me-auto">Themesberg</strong>
<small>11 mins ago</small>
<button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
<div class="toast-body">
Hello, world! This is a toast message.
</div>
</div>
</div>
<div class="col-md-6 col-lg-4">
<div class="toast bg-tertiary text-white fade show" role="alert" aria-live="assertive"
aria-atomic="true">
<div class="toast-header bg-tertiary text-white">
<span class="fab fa-bootstrap"></span>
<strong class="me-auto ms-2">Themesberg</strong>
<small>11 mins ago</small>
<button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
<div class="toast-body">
Hello, world! This is a toast message.
</div>
</div>
</div>
</div>
</div>
</div>
<!-- End of Section -->