Skip to main content

Alerts

<section id="alerts" class="shortcodes"><div class="container">  
<div class="nondismissible-alert"> <div class="row"> <div class="col-12"> <h2>Alerts</h2> <div class="alert alert-primary" role="alert"> <i class="fas fa-exclamation-triangle"></i>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore. </div> <div class="alert alert-secondary" role="alert"> <i class="fas fa-exclamation-triangle"></i>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore. </div> <div class="alert alert-success" role="alert"> <i class="fas fa-exclamation-triangle"></i>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore. </div> <div class="alert alert-danger" role="alert"> <i class="fas fa-exclamation-triangle"></i>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore. </div> <div class="alert alert-warning" role="alert"> <i class="fas fa-exclamation-triangle"></i>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore. </div> <div class="alert alert-info" role="alert"> <i class="fas fa-exclamation-triangle"></i>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore. </div> <div class="alert alert-light" role="alert"> <i class="fas fa-exclamation-triangle"></i>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore. </div> <div class="alert alert-dark" role="alert"> <i class="fas fa-exclamation-triangle"></i>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore. </div> </div> </div> </div> </div></section>

Dismissible Alerts

<section id="alerts" class="shortcodes"><div class="container">  
<div class="dismissible-alert"> <div class="row"> <div class="col-12"> <h2>Dismissible Alerts</h2> <div class="alert alert-primary alert-dismissible fade show" role="alert"> <i class="fas fa-exclamation-triangle"></i><strong>Lorem ipsum dolor sit amet</strong> consectetur adipiscing elit. In nec nulla non nisi feugiat placerat. Pellentesque vel rhoncus odio, sed hendrerit libero. <button type="button" class="close" data-dismiss="alert" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div> <div class="alert alert-secondary alert-dismissible fade show" role="alert"> <i class="fas fa-exclamation-triangle"></i><strong>Lorem ipsum dolor sit amet</strong> consectetur adipiscing elit. In nec nulla non nisi feugiat placerat. Pellentesque vel rhoncus odio, sed hendrerit libero. <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="fas fa-exclamation-triangle"></i><strong>Lorem ipsum dolor sit amet</strong> consectetur adipiscing elit. In nec nulla non nisi feugiat placerat. Pellentesque vel rhoncus odio, sed hendrerit libero. <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="fas fa-exclamation-triangle"></i><strong>Lorem ipsum dolor sit amet</strong> consectetur adipiscing elit. In nec nulla non nisi feugiat placerat. Pellentesque vel rhoncus odio, sed hendrerit libero. <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="fas fa-exclamation-triangle"></i><strong>Lorem ipsum dolor sit amet</strong> consectetur adipiscing elit. In nec nulla non nisi feugiat placerat. Pellentesque vel rhoncus odio, sed hendrerit libero. <button type="button" class="close" data-dismiss="alert" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div> <div class="alert alert-info alert-dismissible fade show" role="alert"> <i class="fas fa-exclamation-triangle"></i><strong>Lorem ipsum dolor sit amet</strong> consectetur adipiscing elit. In nec nulla non nisi feugiat placerat. Pellentesque vel rhoncus odio, sed hendrerit libero. <button type="button" class="close" data-dismiss="alert" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div> <div class="alert alert-light alert-dismissible fade show" role="alert"> <i class="fas fa-exclamation-triangle"></i><strong>Lorem ipsum dolor sit amet</strong> consectetur adipiscing elit. In nec nulla non nisi feugiat placerat. Pellentesque vel rhoncus odio, sed hendrerit libero. <button type="button" class="close" data-dismiss="alert" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div> <div class="alert alert-dark alert-dismissible fade show" role="alert"> <i class="fas fa-exclamation-triangle"></i><strong>Lorem ipsum dolor sit amet</strong> consectetur adipiscing elit. In nec nulla non nisi feugiat placerat. Pellentesque vel rhoncus odio, sed hendrerit libero. <button type="button" class="close" data-dismiss="alert" aria-label="Close"> <span aria-hidden="true">&times;</span> </button> </div> </div> </div> </div></div></section>
Header Style
COLOR SCHEMES
Buy Now
https://dev-fluid-d11.pantheonsite.io