# vue-skycon

> Skycons weather icons in VueJS

Latest version **1.1.0** (published 2023-05-23) · Apache v2.0 license · 0 weekly downloads

## Install

```sh
npm install vue-skycon
pnpm add vue-skycon
yarn add vue-skycon
bun add vue-skycon
```

## Health

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

Positive: no vulnerabilities.

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

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.0 |
| Published | 2023-05-23 |
| First published | 2018-08-18 |
| Weekly downloads | 0 |
| License | Apache v2.0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 489.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 3 |
| Author | Tim Leland |
| Maintainers | timleland |
| Keywords | skycons, skycon, weather, vue, icons, animated |

## Links

- npm: https://www.npmjs.com/package/vue-skycon
- Repository: https://github.com/timleland/vue-skycon
- Homepage: https://github.com/timleland/vue-skycon#readme
- Issues: https://github.com/timleland/vue-skycon/issues
- npm.io page: https://npm.io/package/vue-skycon

## Alternatives

- [@fortawesome/react-fontawesome](https://npm.io/package/@fortawesome/react-fontawesome.md) — 2.2M weekly downloads
- [roboto-fontface](https://npm.io/package/roboto-fontface.md) — 196.0K weekly downloads
- [@react-native-vector-icons/common](https://npm.io/package/@react-native-vector-icons/common.md) — 150.4K weekly downloads
- [@procore/core-icons](https://npm.io/package/@procore/core-icons.md) — 4.6K weekly downloads
- [@react-md/material-icons](https://npm.io/package/@react-md/material-icons.md) — 1.6K weekly downloads

## Recent versions

- 1.1.0 (latest) — 2023-05-23
- 1.0.4 — 2018-12-22
- 1.0.3 — 2018-08-30
- 1.0.2 — 2018-08-18
- 1.0.1 — 2018-08-18
- 1.0.0 — 2018-08-18

## README

# Vue Skycons
Easily use [Skycons](https://t.ly/_ic0) in your VueJs apps. Example use [Weather Extension](https://weatherextension.com/) and [WeatherTab](https://timleland.com/weathertab/)

<a href="https://www.digitalocean.com/?refcode=95e54284e826&utm_campaign=Referral_Invite&utm_medium=Referral_Program&utm_source=badge"><img src="https://web-platforms.sfo2.cdn.digitaloceanspaces.com/WWW/Badge%201.svg" alt="DigitalOcean Referral Badge" /></a>

## Installation   
### NPM   
```
npm i vue-skycon
```

### YARN   
```
yarn add vue-skycon
```

## Installation
```
import Vue from 'vue'
import VueSkycons from 'vue-skycon'

Vue.use(VueSkycons)

```

## Usage
```
<template>
  <div>
    <!-- General usage -->
    <skycon condition="clear-day" width="40" height="40"></skycon>
    <skycon condition="clear-night" width="40" height="40"></skycon>
    <skycon condition="partly-cloudy-day" width="40" height="40"></skycon>
    <skycon condition="partly-cloudy-night" width="40" height="40"></skycon>
    <skycon condition="cloudy" width="40" height="40"></skycon>
    <skycon condition="rain" width="40" height="40"></skycon>
    <skycon condition="sleet" width="40" height="40"></skycon>
    <skycon condition="snow" width="40" height="40"></skycon>
    <skycon condition="wind" width="40" height="40"></skycon>
    <skycon condition="fog" width="40" height="40"></skycon>
  </div>
</template>
```

## Props
```
  // Icon size
  width: {
    type: Number,
    default: 64
  },

  height: {
    type: Number,
    default: 64
  },

  color: {
    type: String,
    default: 'black'
  },

  // Weather condition
  condition: {
    type: String
  }
```

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