vuemodoro v1.0.2

vuemodoro

SFC Vue component implementing a Pomodoro timer

Vuemodoro is a Vue Single File Component implementing a countdown timer, intended to provide a Pomodoro countdown in your Vue applications. It comes with a set of properties making the component customizable for your needs. For example, you can customize either the duration of the countdown or the labels of the buttons for interacting with the component.
Moreover, you can choose between different styles for your Vuemodoro look and feel. 🍅

Properties

If you need to customize the Pomodoro timer behavior, you can use one of the following optional properties.

Installation

You can install Vuemodoro using npm:

npm install --save vuemodoro

Alternatively, you can import vuemodoro via <script> tag in the browser directly, avoiding the NPM installation:

<script src="https://unpkg.com/vue"></script>
<script src="https://unpkg.com/vuemodoro"></script>

Usage

Once installed, it is easy to use it.

Importing the component

First, you need to import vuemodoro in your files. You can do that in different ways. For example, it can be imported into a build process for use in full-fledged Vue applications:

import Pomodoro from 'vuemodoro';

export default {
  components: {
    Pomodoro,
  },
  // rest of the component
}

Using the component

Once imported, you can use your component as follows:

<Pomodoro/>

Themes

Vuemodoro comes with a theme prop. It allows to modify the look and feel of the component. The available options are:

• bare, it is a minimal look and feel, intended for customization:

• light, it is the light theme of Vuemodoro:

• dark, it is the dark theme of Vuemodoro:

Contributing

This component can be improved both in features and performances. Please, help me in doing it better 🍅