ALERTS

            
<div class="row mb-5">
<div class="col-md-12">
    <!-- Alerts Style 1 -->
    <h2 class="mb-4">Alerts Style 1</h2>
    <div class="alert-box alert-style-1">
        <div class="alert alert-info alert-dismissible fade show" role="alert">
            <i class="fa fa-info mr-3"></i>
            <strong>Info: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div> 
        <div class="alert alert-warning alert-dismissible fade show" role="alert">
            <i class="fa fa-warning mr-3"></i>
            <strong>Warning: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <i class="fa fa-times mr-3"></i>
            <strong>Error: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="alert alert-success alert-dismissible fade show" role="alert">
            <i class="fa fa-check mr-3"></i>
            <strong>Success: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
    </div>
</div>
</div> 
            
            Copy to clipboard
            

            
<div class="row mb-5">
<div class="col-md-12">
    <!-- Alerts Style 2 -->
    <h2 class="mb-4">Alerts Style 2</h2>
    <div class="alert-box alert-style-2">
        <div class="alert alert-info alert-dismissible fade show" role="alert">
            <i class="fa fa-info mr-3"></i>
            <strong>Info: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div> 
        <div class="alert alert-warning alert-dismissible fade show" role="alert">
            <i class="fa fa-warning mr-3"></i>
            <strong>Warning: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <i class="fa fa-times mr-3"></i>
            <strong>Error: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="alert alert-success alert-dismissible fade show" role="alert">
            <i class="fa fa-check mr-3"></i>
            <strong>Success: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
    </div>
</div>
</div> 
            
            Copy to clipboard
            

            
<div class="row mb-5">
<div class="col-md-12">
    <!-- Alerts Style 3 -->
    <h2 class="mb-4">Alerts Style 3</h2>
    <div class="alert-box alert-style-3">
        <div class="alert alert-info alert-dismissible fade show" role="alert">
            <i class="fa fa-info mr-3"></i>
            <strong>Info: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div> 
        <div class="alert alert-warning alert-dismissible fade show" role="alert">
            <i class="fa fa-warning mr-3"></i>
            <strong>Warning: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <i class="fa fa-times mr-3"></i>
            <strong>Error: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="alert alert-success alert-dismissible fade show" role="alert">
            <i class="fa fa-check mr-3"></i>
            <strong>Success: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
    </div>
</div>
</div>  
            
            Copy to clipboard
            

            
<div class="row mb-5">
<div class="col-md-12">
    <!-- Alerts Style 4 -->
    <h2 class="mb-4">Alerts Style 4</h2>
    <div class="alert-box alert-style-4">
        <div class="alert alert-info alert-dismissible fade show" role="alert">
            <i class="fa fa-info mr-3"></i>
            <strong>Info: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div> 
        <div class="alert alert-warning alert-dismissible fade show" role="alert">
            <i class="fa fa-warning mr-3"></i>
            <strong>Warning: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <i class="fa fa-times mr-3"></i>
            <strong>Error: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="alert alert-success alert-dismissible fade show" role="alert">
            <i class="fa fa-check mr-3"></i>
            <strong>Success: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
    </div>
</div>
</div>  
            
            Copy to clipboard
            

            
<div class="row mb-3">
<div class="col-md-12">
    <!-- Alerts Style 5 -->
    <h2 class="mb-4">Alerts Style 5</h2>
    <div class="alert-box alert-style-5">
        <div class="alert alert-info alert-dismissible fade show" role="alert">
            <div class="alert-icon">
                <i class="fa fa-info mr-3"></i>
            </div>
            <strong>Info: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div> 
        <div class="alert alert-warning alert-dismissible fade show" role="alert">
            <div class="alert-icon">
                <i class="fa fa-warning mr-3"></i>
            </div>
            <strong>Warning: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <div class="alert-icon">
                <i class="fa fa-times mr-3"></i>
            </div>
            <strong>Error: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="alert alert-success alert-dismissible fade show" role="alert">
            <div class="alert-icon">
                <i class="fa fa-check mr-3"></i>
            </div>
            <strong>Success: User pending action</strong>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
    </div>
</div>
</div> 
            
            Copy to clipboard