##### Milestone 30%

##### Release 60%

- Mailbox
- Calendar
- Contacts
- Media
- Documents
- Project
- Forum
- Dashboard

# Animation

### General Animation

#### Basic Animation

Use a classes `.animation-{name}` to quickly add a animation.

#### Reverse Animation

To reverse any animation, add the `.animation-reverse` class.

#### Animation Duration

To stretch the animation duration, add the `.animation-duration-{time(second)}` class.

#### Animation Delay

To set the animation delay, add the `.animation-delay-{time(milesecond)}` class.

### NProgress official website

#### Basic API

#### Loader Positions

#### Style

### Loading Spinner

#### Select Css Loading Spinner

This is a collection of loading spinners animated with CSS. Add `.loader` and `.loader-{type}` to enable loading spinner. You can click the button below to find the style which you like best.

### Appear Animate official website

### Animate Fade

Using `data-plugin="appear"` and `data-animate="fade"` to add appear animate.

### Animate Slide Top

Using `data-plugin="appear"` and `data-animate="slide-top"` to add appear animate.

### Animate Slide Bottom

Using `data-plugin="appear"` and `data-animate="slide-bottom"` to add appear animate.

### Animate Scale Up

Using `data-plugin="appear"` and `data-animate="scale-up"` to add appear animate.

### Animate Scale Down

Using `data-plugin="appear"` and `data-animate="scale-down"` to add appear animate.

### Animate Slide Right

Using `data-plugin="appear"` and `data-animate="slide-right"` to add appear animate.