Alert component

The alert component is used to display messages to the user.

Alert grey message
Alert blue message
Alert yellow message
Alert error message
Alert turquoise message
Alert green message
            <div class="col-4 alert">
                Alert grey message
                <button type="button" class="alert-close">&#215;</button>
            </div>
 
            <div class="col-4 alert primary">
                Alert blue message
                <button type="button" class="alert-close">&#215;</button>
            </div>
 
            <div class="col-4 alert warning">
                Alert yellow message
                <button type="button" class="alert-close">&#215;</button>
            </div>
 
            <div class="col-4 alert error">
                Alert error message
                <button type="button" class="alert-close">&#215;</button>
            </div>
 
            <div class="col-4 alert info">
                Alert turquoise message
                <button type="button" class="alert-close">&#215;</button>
            </div>
 
            <div class="col-4 alert success">
                Alert green message
                <button type="button" class="alert-close">&#215;</button>
            </div>
 

Usage

Use the alert CSS class to display an alert. It's possible to close the alert by clicking on the close button. For add close button, use the alert-close CSS class.

WARNING ! The alert-close, required the askacss javascript file.