Documentation

Clay Progress Bars

You can add progress bars to your app with the clay:progressbar tag. These indicate the completion percentage of a task and come in three status styles: default (blue), warning (red), and complete (green with checkmark). You can provide a minimum value (minValue) and a maximum value (maxValue).

Default progress bar:

<clay:progressbar 
    maxValue="<%= 100 %>" 
    minValue="<%= 0 %>" 
    value="<%= 30 %>" 
/>

You can include progress bars in your apps.

Warning progress bar:

<clay:progressbar 
    maxValue="<%= 100 %>" 
    minValue="<%= 0 %>" 
    status="warning" 
    value="<%= 70 %>" 
/>

Warning progress bars indicate that the progress has not completed due to an error.

Complete progress bar:

<clay:progressbar 
    status="complete" 
/>

The complete progress bar indicates the progress is complete.

Clay taglibs make it easy to track progress in your apps.