0.0.7 • Published 6 years ago

react-circle-clock v0.0.7

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

react-circle-clock

React circle clock component

Installation

$ npm install react-circle-clock --save

DEMO

Displays 2 circle SVGs with customizable radius and stroke. One circle is in the background and one circle keeps animating by time - ticks in each second.

Demo Image1

The clock can overlap, it won't start from the begining, but continue ticking by inverting the colors.

Demo Image2

Usage

import React from 'react';
import CircleClock from 'react-circle-clock';

class Dashboard extends React.Component{
  render() {
    return (
      <div>
        <CircleClock />
      </div>
    )
  }
}

Components

CircleClock

Props

NameTypeDefaultDescription
radiusnumber65
sizenumber150
primaryColorstring'#00ADB5'
secondaryColorstring'#F4AB63'
customFontSizestring'24px'
strokestring'10'
strokeBackstring'10'
strokeFrontstring'10'

License

This software is released under the MIT License.

0.0.7

6 years ago

0.0.6

6 years ago

0.0.5

6 years ago

0.0.4

6 years ago

0.0.3

6 years ago

0.0.2

6 years ago

0.0.1

6 years ago