Modals | Porto Admin - Responsive HTML5 Template 1.4.1

- 3
- 4
- 3

John Doe Junior administrator

## Modals

## Basic

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

Basic

## Are you sure?

Are you sure that you want to delete this image?

Icon

## Are you sure?

Are you sure that you want to delete this image?

Center Icon

#### Are you sure?

Are you sure that you want to delete this image?

No Title

Are you sure that you want to delete this image?

No Footer

## Are you sure?

Are you sure that you want to delete this image?

Center

Are you sure that you want to delete this image?

Bootstrap

#### Are you sure?

Are you sure that you want to delete this image?

## Contextual

You can use any of the avaible contextual classes to create a styled modal.

Primary

## Are you sure?

#### Primary

Are you sure that you want to delete this image?

Success

## Success!

#### Success

This is a successfull message.

Info

## Information

#### Info

This is a information message.

Warning

## Warning!

#### Warning

This is a warning message.

Danger

## Danger!

#### Danger

This is a danger message.

## Header Color

Colored Header Modals

Primary

## Are you sure?

#### Primary

Are you sure that you want to delete this image?

Success

## Success!

#### Success

This is a successfull message.

Info

## Information

#### Info

This is a information message.

Warning

## Warning!

#### Warning

This is a warning message.

Danger

## Danger!

#### Danger

This is a danger message.

## Full Color

Full Colored Modals

Primary

## Are you sure?

#### Primary

Are you sure that you want to delete this image?

Success

## Success!

#### Success

This is a successfull message.

Info

## Information

#### Info

This is a information message.

Warning

## Warning!

#### Warning

This is a warning message.

Danger

## Danger!

#### Danger

This is a danger message.

## Sizes

Set the size of the modal using a CSS class.

Extra Small

## Are you sure?

Are you sure that you want to delete this image?

Small

## Are you sure?

Are you sure that you want to delete this image?

Medium

## Are you sure?

Are you sure that you want to delete this image?

Large

## Are you sure?

Are you sure that you want to delete this image?

Full

## Are you sure?

Are you sure that you want to delete this image?

## Modal with CSS animation

Animations are added with simple CSS transitions, you can make them look however you wish.

Open with fade-zoom animation
Open with fade-slide animation

## Are you sure?

Are you sure that you want to delete this image?

## Form

Modal with a form and buttons.

Open Form

## Registration Form

Name
Email
URL
State
Comment

## Ajax

You have full control of what is displayed in modal, align it to any side via CSS, enable or disable scroll on right side of window.

Load Ajax Content