0.1.3 • Published 2 years ago

react-countdown-customizable v0.1.3

Weekly downloads
8
License
MIT
Repository
github
Last release
2 years ago

React Customizable Countdown

You can install the module via npm:

npm install react-countdown-customizable --save

Usage

For using counter with standard styles -

import React from 'react';
import ReactDOM from 'react-dom';
import Counter from 'react-countdown-customizable';
 
ReactDOM.render(
  <Counter 
    date="2021-01-10T14:48:00" 
  />,
  document.getElementById('root')
);

For applying custom styles for labels, counter or timer component itself

import React from 'react';
import ReactDOM from 'react-dom';
import Counter from 'react-countdown-customizable';
 
ReactDOM.render(
   <Counter 
        date="2021-01-10T14:48:00" 
        timerStyle={{marginTop:'10px', width:'20%'}} 
        counterStyle={{fontSize:'15px', color:'white', border:'1px solid red', padding:'10px', margin:'5px', backgroundColor:'red'}} 
        labelStyle={{color:'grey',fontSize:'12px', textTransform:'uppercase'}}
    /> ,
  document.getElementById('root')

Demo

live

Props

NameTypeDefault
dateStringdate 24 Hrs from now
timerStylestyle Objectundefined
counterStylestyle Objectundefined
labelStylestyle Objectundefined