Appearance
Progress
EProgress
The progress indicator represents the present state of a process or a level of achievement. Demo Here
Usage
vue
<EProgress :fill="50"/>
Props
For EProgress
component, the following props are available:
Prop | Type | Default | Note |
---|---|---|---|
width | String | - | Sets the component's width. |
height | String | - | Sets the component's height. |
rounded | Boolean | false | It creates a circular progress. |
square | Boolean | false | Removes rounded corners of the element. |
showPercentage | Boolean | true | Shows the percentage of progress if true. |
fill | [Number, String] | 0 | Displays the level of completion. |
size | String | "md" | The EProgress element has three predefined sizes: sm , md , lg . |
variant | String | "fill" | The EProgress element can be represented in two ways: fill and gradient . Gradient displays smooth transitions between light and dark shades of specified color. |
color | String | "primary" | The given color is applied to the progress - utility colors are supported (e.g primary or danger ). you'll find a list of built-in classes on the src/styles/_vars.scss page. |
title | String | - | Displays title. |