Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 1,000,000+ packages pre-installed, including @forter/progress-circle with all npm packages installed. Try it out:

var progressCircle = require("@forter/progress-circle")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

@forter/progress-circle v4.0.26

Progress Circle from Forter Components

fc-progress-circle

show progress by nice border around the circle depends on you score.

Usage

<script>
  import '@forter/progress-circle';
</script>

<fc-progress-circle>
</fc-progress-circle>

Properties

PropertyAttributeTypeDefaultDescription
intentintent"primary" \| "secondary" \| "success" \| "apply" \| "danger" \| "warn"The button's intent. See Intents in README.
percentagepercentagenumber100score as number. example: 95
sizesize"small" \| "medium" \| "large"Pre-Defined size

CSS Custom Properties

PropertyDescription
--fc-progress-circle-colorthe color. default: var(--violet), example: gold
--fc-progress-circle-contentcontent inside circle. example: '100'
--fc-progress-circle-font-colorcontent font color
--fc-progress-circle-sizeheight and width. default: 88px, example: 66px

Metadata

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free