react flip clock timer (Count down)

Based on the chinese version: http://xiaxiangfeng.github.io/flip-clock/index.html https://www.npmjs.com/package/react-flip-clock https://github.com/xiaxiangfeng/react-flip-clock

Installation

npm i react-flip-clock-count-down

Examples

Using webpack

import Clock from "react-flip-clock-count-down";

const Index = () => {
  return (
    <div>
      <Clock endTime={1618237200000} />
    </div>
  );
};

render(<Index />, document.getElementById("app"));

Custom Styles

You can override this

/*Width and Height*/
.flip-clock-wrapper ul {
  width: 60px;
  height: 90px;
}

/*Background colours*/
.flip-clock-wrapper .inn {
  background-color: #502d2d;
  font-size: 70px;
}

Build Setup

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report

# run unit tests
npm run unit

# run all tests
npm test