Alert messages to alert the user. These will fill the full with of the containing element.
<div class="alert-box cv-ico-general-info2"> This is a generic alert message. <a href="" class="close-alert"></a> </div> <div class="alert-box info"> This is a information alert message. <a href="" class="close-alert"></a> </div> <div class="alert-box success"> This is a success alert message. <a href="" class="close-alert"></a> </div> <div class="alert-box warning"> This is a warning alert message. <a href="" class="close-alert"></a> </div> <div class="alert-box error"> This is an error alert message. <a href="" class="close-alert"></a> </div>
Alert messages to alert the user. These will dispaly inline with other elements, making use of the space provided.
<div class="alert-box inline-alert cv-ico-general-info2"> This is a generic alert message. <a href="" class="close-alert"></a> </div> <div class="alert-box inline-alert info"> This is a information alert message. <a href="" class="close-alert"></a> </div> <div class="alert-box inline-alert success"> This is a success alert message. <a href="" class="close-alert"></a> </div> <div class="alert-box inline-alert warning"> This is a warning alert message. <a href="" class="close-alert"></a> </div> <div class="alert-box inline-alert error"> This is an error alert message. <a href="" class="close-alert"></a> </div>
Notifications to alert the user. These are fixed position overlayed.
<!-- Notifications --> <div class="cv-notification-area"> <!-- Standard Alert --> <div class="cv-notification"> <div class="notification-icon"></div> <div class="notification-content"> <span class="notification-heading">Standard Notification Heading</span> <span class="notification-message">This is a general notification</span> <div class="notification-actions"> <a href="" class="btn small">Confirm</a> </div> </div> </div> <!-- Info Alert --> <div class="cv-notification info"> <div class="notification-icon"></div> <div class="notification-content"> <span class="notification-heading">Info Notification Heading</span> <span class="notification-message">This is a general notification</span> <div class="notification-actions"> <a href="" class="btn small">Confirm</a> </div> </div> </div> <!-- Error Alert --> <div class="cv-notification error"> <div class="notification-icon"></div> <div class="notification-content"> <span class="notification-heading">Error Notification Heading</span> <span class="notification-message">This is a error notification</span> <div class="notification-actions"> <a href="" class="btn small">Confirm</a> </div> </div> </div> <!-- Success Alert --> <div class="cv-notification success"> <div class="notification-icon"></div> <div class="notification-content"> <span class="notification-heading">Success Notification Heading</span> <span class="notification-message">This is a success notification</span> <div class="notification-actions"> <a href="" class="btn small">Confirm</a> </div> </div> </div> <!-- Warning Alert --> <div class="cv-notification warning"> <div class="notification-icon"></div> <div class="notification-content"> <span class="notification-heading">Warning Notification Heading</span> <span class="notification-message">This is a warning notification</span> <div class="notification-actions"> <a href="" class="btn small">Confirm</a> </div> </div> </div> </div>