vue3-skycons v1.0.3

Installation

NPM

npm install --save vue3-skycons

Examples

Using Component

</details>

## vue3-skycons Attributes

| **Name** | **Description**             | **Type**               | **Default** |
| -------- | -----------------------     | ---------------------- | ----------- |
| condition| Weather condition           | `string`               | —           | 
| size     | Icon size                   | `string`/`number`      | 64          |
| color    | Icon color                  | `string`               | black       |
| paused   | Start with paused animation | `boolean`              | false       |
| speed    | The animation speed         | `string`/`number`      | 1           |

### Event example

```js
<template>
  <skycon condition="snow" size="128" paused @load="onLoad" />
</template>

<script setup>
import Skycon from "vue3-skycons";

const onLoad = (player) => {
      console.log("loaded");
      setInterval(() => {
        if (player.paused) {
          player.play();
        } else {
          player.pause();
        }
      }, 1000);
    }
</scrip>

Animation Speed

The speed attributes is a decimal number to control the animation speed. It is a multiplyer to the original speed. 1 means the normal speed. 0.5 means half the normal speed. 2 means twice as fast as the normal speed.

<template>
  <skycon condition="wind" size="128" speed="1" />
  <skycon condition="wind" size="128" speed="3" />
  <skycon condition="wind" size="128" speed="0.5" />
</template>

<script setup>
import Skycon from "vue3-skycons";
</script>