Modal & Notification page header description goes here...

APP NOTIFICATION

Infinite Admin build in app notification comes with default (white) or inverse (black) styling.

Reminder

Meeting with Terry

Details Close
EXAMPLE:
<a href="#" class="btn btn-primary btn-sm" data-toggle="notification" 
    data-title="Reminder" 
    data-content="Meeting with Terry"
    data-icon="ti-alarm-clock" 
    data-icon-class="bg-grey"
    data-btn="true"
    data-btn-text="Details"
    data-btn-attr="data-click='trigger-details'">Demo</a>
1. Default Notification Demo 4. Inverse Style Notification Demo
2. Notification with Image Demo 5. Without Icon Demo
3. Custom Button url Demo 6. Single Button Demo
Available Options
1 data-title="Calendar" 8 data-content="Tom's Birthday"
2 data-icon="ti-alarm-clock" 9 data-icon-class="bg-grey"
3 data-img="../assets/img/user.jpg" 10 data-img-class="bg-inverse"
4 data-btn="true" 11 data-btn-text="Details"
5 data-btn-url="http://www.google.com" 12 data-btn-url="data-click='trigger-button'"
6 data-close-btn="disabled" 13 data-close-text="Close"
7 data-autoclose="true" 14 data-autoclose-time="5000"

BOOTSTRAP MODAL

Modals are streamlined, but flexible, dialog prompts with the minimum required functionality and smart defaults.

Default Modal

Normal modal component like modal header, body and footer.

 Demo
Inverse Modal

Place a .modal-inverse css class on .modal for inverse modal.

 Demo
Full Cover Modal

Place a .modal-cover css class on .modal for full cover modal.

 Demo
Inverse Full Cover Modal

Place an additional .modal-inverse css class on .modal for inverse full cover modal.

 Demo
Full Width Modal

Place a .modal-full css class on .modal-dialog for full width modal.

 Demo
Large Modal

Place a .modal-lg css class on .modal-dialog for large modal.

 Demo
Small Modal

Place a .modal-sm css class on .modal-dialog for small modal.

 Demo
Reset Setting