kebs-progress-circle
v0.1.5
Published
[![npm version](https://badge.fury.io/js/angular2-expandable-list.svg)](https://badge.fury.io/js/angular2-expandable-list) [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettie
Downloads
109
Readme
kebs-progress-circle
kebs-progress-circle
is a simple animated progress indicator with percentage value.
Prerequisites
This project requires NodeJS and NPM. Node and NPM are really easy to install. To make sure you have them available on your machine, try running the following command.
$ npm -v && node -v
6.4.1
v8.16.0
Table of contents
Getting Started
These instructions will get you a copy of the project up and running on your local machine for development and testing purposes. See deployment for notes on how to deploy the project on a live system.
Installation
BEFORE YOU INSTALL: please read the prerequisites
To install and set up the library, run:
$ npm install kebs-progress-circle
Usage
app.module.ts
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import {KebsProgressCircleModule} from 'kebs-progress-circle'
@NgModule({
declarations: [
AppComponent
],
imports: [
CommonModule,
KebsProgressCircleModule
],
providers: [],
})
export class AppModule { }
app.component.html
<kebs-progress-circle
[percentageValue]="70" [progressSpeed]="50" [loadBarColor]="#45546E" [loadBarBgColor]="#DADCE2">
</kebs-progress-circle>
Inputs
|Property|Type|Description
|---|---|---
|percentageValue|number
|Percentage value
|progressSpeed|number
|Progress bar speed (Indirectly propotional)
|loadBarColor|string
| Bar color
|loadBarBgColor|string
| Bar background color
Built With
- Angular
- VS code
- Love