# Progressbar

Progressbar provide up-to-date feedback on the progress of a workflow or action with simple yet flexible bars.

## Bootstrap Progressbar

This is the default progress bar provided by Bootstrap. You can also convert it to stripped, animated or stacked progressbar.

## Propeller Progressbar

It consists of Bootstrap HTML structure enhanced with Propeller customized classes based on Material Standards. Include Propeller Static Progressbar to your code by adding `.pmd-progress`.

## Striped Progressbar

Include Propeller Striped Progressbar to your code by adding `.progress-striped` besides `.pmd-progress`.

## Animated Progressbar

Include Propeller Animated Progressbar to your code by adding `.active` beside `.progress-striped`.

## Stacked Progressbar

Include Propeller Stacked Progressbar to your code by adding `.progress-bar` inside the wrapper div containing `.pmd-progress`.

## Configuration Options

The Propeller CSS classes apply various predefined visual enhancements to the progressbar. The table lists the available classes and their effects.

Propeller Class | Effect | Remark
--- | --- | ---
`.progress` | Used to initialize static progress bar. | Required
`.pmd-progress` | Add this class to create propeller customized progress bar. | Required
`.progress-striped` | Used to add stripes to the progress bar. | Optional
`.active` | Add this class along with `.progress-stripped` to animate the progress bar. | Optional
`.progress-bar` | Use this class to create a stacked progress bar. | Optional