section#progress

  h2 Progress Bars
  p Currently progress bars are built as <code>div</code> elements due to still incomplete implementation of <code>progress</code> element. Take note that progress meter is a dummy value that should be adjusted.

  h3 Large progress bar

  .progress.progress-large.progress-success
    span.meter

  .progress.progress-large.progress-warning
    span.meter

  .progress.progress-large.progress-error
    span.meter

  .progress.progress-large
    span.meter

  :markdown
    ```html
      <div class='progress progress-large progress-success'>
        <span class='meter'></span>
      </div>
      <div class='progress progress-large progress-warning'>
        <span class='meter'></span>
      </div>
      <div class='progress progress-large progress-error'>
        <span class='meter'></span>
      </div>
      <div class='progress progress-large'>
        <span class='meter'></span>
      </div>
    ```

  h3 Small progress bar
  p For small bars use <code>progress-small</code> class.

  .progress.progress-small.progress-success
    span.meter

  .progress.progress-small.progress-warning
    span.meter

  .progress.progress-small.progress-error
    span.meter

  .progress.progress-small
    span.meter

  :markdown
    ```html
      <div class='progress progress-small'>
        <span class='meter'></span>
      </div>
    ```

  h3 Rounded progress bar
  p For rounded bars use <code>progress-rounded</code> class.

  .progress.progress-small.progress-rounded.progress-error
    span.meter

  .progress.progress-small.progress-rounded.progress-warning
    span.meter

  .progress.progress-small.progress-rounded.progress-success
    span.meter

  .progress.progress-small.progress-rounded
    span.meter

  :markdown
    ```html
      <div class='progress progress-small progress-rounded'>
        <span class='meter'></span>
      </div>
    ```