{{-- <!-- alert-notification -->
<div class="alert alert-light alert-dismissible fade show" role="alert">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eu placerat est. Aliquam sed diam et arcu posuere dapibus. Fusce sapien erat, porta eget est sed, elementum interdum est. Integer in congue neque.
    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close">
        <!-- close -->
        <svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 311.16 311.19">
        <path d="M106.68,375.18a21.33,21.33,0,0,0,30.17,30.17L256,286.17,375.17,405.33a21.33,21.33,0,1,0,30.17-30.17L286.17,256,405.33,136.82a21.33,21.33,0,0,0-30.17-30.17L256,225.83,136.84,106.67a21.33,21.33,0,1,0-30.17,30.17L225.84,256Z" transform="translate(-100.42 -100.41)"/>
        </svg>
    </button>
</div>
<!-- alert-notification end -->

<!-- alert-notification -->
<div class="alert alert-light alert-dismissible fade show" role="alert">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent eu placerat est. Aliquam sed diam et arcu posuere dapibus.
    <button type="button" class="btn-ok" data-bs-dismiss="alert" aria-label="Close">Ok</button>
</div>
<!-- alert-notification end --> --}}