cla-progress-circle

Progress Circle - Displays a percentage circle with a progress bar around the outside.

Usage

<cla-progress-circle primarycolor="#00c6b6" size="small" percentage="25"></cla-progress-circle>

Properties

Property Attribute Description Type Default
customtext customtext Using the customtext attribute you can add text in place of the percentage number string undefined
inverted inverted Whether to use the inverted variant of the progress circle. boolean undefined
percentage percentage The percentage of completion of the progress circle - this automatically created from the percentage number number 0
primarycolor primarycolor The primary color which affects the percentage bar color and the percentage text color string "#000"
size size The size of the progress circle - defaults to 90px but can set to any size in px, em, rems. string "90px"

Built with StencilJS