# vue-flip-countdown

> Vue flip countdown

Latest version **0.0.3** (published 2018-05-03) · MIT license · 0 weekly downloads

## Install

```sh
npm install vue-flip-countdown
pnpm add vue-flip-countdown
yarn add vue-flip-countdown
bun add vue-flip-countdown
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.3 |
| Published | 2018-05-03 |
| First published | 2018-05-03 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 236.3 KB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 1 |
| Author | Cristóvão Trevisan |
| Maintainers | cristovao-trevisan |
| Keywords | vue, countdown, flip, board |

## Links

- npm: https://www.npmjs.com/package/vue-flip-countdown
- Repository: https://github.com/cristovao-trevisan/vue-flip-countdown
- Homepage: https://github.com/cristovao-trevisan/vue-flip-countdown#readme
- Issues: https://github.com/cristovao-trevisan/vue-flip-countdown/issues
- npm.io page: https://npm.io/package/vue-flip-countdown

## Dependencies (1)

- [gsap](https://npm.io/package/gsap.md) ^1.20.4

## Recent versions

- 0.0.3 (latest) — 2018-05-03
- 0.0.2 — 2018-05-03
- 0.0.1 — 2018-05-03

## README

# Vue Flip Countdown

[![npm version](https://badge.fury.io/js/vue-flip-countdown.svg)](https://badge.fury.io/js/vue-flip-countdown)

Simple board countdown component for vue.

[Live Demo](https://cristovao-trevisan.github.io/vue-flip-countdown/)

## Usage

```jsx
import Countdown from 'vue-flip-countdown'

export default {
  name: 'example-app',

  render() {
    return (
      <div>
        <Countdown
          end={Date.now() + (1000 * 60 * 60)}
        />
        <Countdown
          end={Date.now() + (1000 * 60 * 60 * 4)}
          size={60}
        />
        <Countdown
          end={Date.now() + (1000 * 60 * 60 * 26)}
          size={80}
          labelStyle={{ color: 'blue', fontSize: '20px', height: '22px' }}
        />
        <Countdown
          background="black"
          style={{ color: 'white' }}
          labelStyle={{ color: 'gray' }}
        />
      </div>
    )
  },
}
```

## Props

- end: Number
- background: String
- size: Number (in px)
- labelStyle: Object (inline jsx style object)
- sections: Object[] in the format:
    - label: String (e.g. 'Hours')
    - divisor: Number (e.g. 60 * 60 * 1000)
    - mod: Number (e.g. 24)

---
_Source: https://npm.io/package/vue-flip-countdown · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._