1.0.0 • Published 7 years ago

ionic-steps-bar v1.0.0

Weekly downloads
4
License
ISC
Repository
github
Last release
7 years ago

IONIC STEPS BAR

A steps bar component for Ionic.

Steps to start:

0.Install via bower: bower install

1.Include ion-pullup.js in your HTML : <script src="js/ionic-steps-bar.js"></script>

2.Add dependencies to your app : angular.module('yourApp', ['ionic', 'ionic-steps-bar'])

3.Usage:

<ion-view view-title="Ionic Steps Bar"> <ion-content scroll="false"> <div ion-steps-bar set-step="1" options="{numOfSteps: 4,barHeigth: '20pt'}"></div> </ion-content> </ion-view>

Default options:

options = { numOfSteps: 2, numsColor: 'white', componentBack: 'transparent', barHeigth: '20pt', componentMargin: '1% 0', //not configurable highColor: '#8AA39B', highPadding: '0 0.5%', //not configurable backColor: '#95D9C3' }

Configurable options:

numOfSteps - Number of steps to show in the bar. numsColor - Color of numbers in the bar. componentBack - Color of div container for ionic component (TRANSPARENT by DEFAULT). barHeigth - Bar heigth (IF PROVIDED MUST BE IN PTs - 20pt,50pt,100pt etc. and 20pt is MINIMUM ). highColor - Filling color(Color that fills steps when increased / decreased.). backColor - Background color of steps bar.