@@include("./partials/title-meta.html", {"title": "Metrica"}) @@include('./partials/head-css.html') @@include('./partials/left-sidebar-tab.html') @@include('./partials/topbar.html')
  1. Metrica
  2. UI Kit
  3. Modals

Modals

Optional sizes

Modals have three optional sizes, available via modifier classes to be placed on a .modal-dialog.

Size Class Modal max-width Modal Demo
Small .modal-sm 300px
Default None 500px
Large .modal-lg 800px
Extra large .modal-xl 1140px
Default (Center Modal) .modal-dialog-centered 500px
Default (Scroll Modal) .modal-dialog-scrollable 500px

Fullscreen Modal

Another override is the option to pop up a modal that covers the user viewport, available via modifier classes that are placed on a .modal-dialog.

Class Availability Modal Demo
.modal-fullscreen Always
.modal-fullscreen-sm-down Below 576px
.modal-fullscreen-md-down Below 768px
.modal-fullscreen-lg-down Below 992px
.modal-fullscreen-xl-down Below 1200px
.modal-fullscreen-xxl-down Below 1400px

Themes Modal

You can use custom modals with themes colors.

Login & Signup Modal

You can use custom modals with Login and SignUp form.

@@include('./partials/right-sidebar.html') @@include('./partials/footer.html')
@@include('./partials/vendorjs.html')