vue3-flip-countdown - npm Package Compare versions

Comparing version 0.1.3 to 0.1.4

package.json

 {
   "name": "vue3-flip-countdown",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "description": "Countdown timer with Flip Animation for Vue 3.x",
@@ -5,0 +5,0 @@ "repository": {

README.md

 # vue3-flip-countdown
 
-> Countdown timer with Flip Animation for [Vue](https://vuejs.org/ "Vue Homepage") 3.x
+> Customize Countdown timer with Flip Animation for [Vue](https://vuejs.org/ "Vue Homepage") 3.x
 
+> [vue3-flip-countdown.netlify.app](https://vue3-flip-countdown.netlify.app/)
 
 
 <p align="center">
+  
+![Netlify Status](https://api.netlify.com/api/v1/badges/69e11230-2c8b-4725-9540-7c0a861294e4/deploy-status)
   <img src="https://img.shields.io/npm/l/vue3-flip-countdown" />
+  <a href="https://github.com/vuejs/awesome-vue"><img src="https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg"/></a>
   <a href="https://www.npmjs.com/package/vue3-flip-countdown"><img src="https://img.shields.io/npm/v/vue3-flip-countdown"/> 
    <img src="https://img.shields.io/npm/dt/vue3-flip-countdown"/></a>
   <a href="https://vuejs.org/"><img src="https://img.shields.io/badge/vue-3.x-brightgreen.svg"/></a>
- </p>
+</p>
 
 
+## [Demo](https://vue3-flip-countdown.netlify.app/)
+
+
+<a href="https://vue3-flip-countdown.netlify.app/" target="_blank"><img src="https://user-images.githubusercontent.com/29631083/142426544-536cc337-106b-4f3f-ba09-85f1062e3c5c.gif" width="800"/></a>
+
+
+## Table of contents
+  
+
+- [Demo](#demo)
+- [Installation](#installation)
+- [Global Usage](#global-usage)
+- [Single File Component Usage](#single-file-component-usage)
+- [Emits](#emits)
+- [Props](#props)
+- [References](#references)
+- [Requirements](#requirements)
+- [License](#license)
+
 ## Installation
@@ -63,24 +86,30 @@
 
+## Emits
+
+| Name | Description | 
+| --- | --- |
+| timeElapsed | event that created when the time came | 
+
 ## Props
 
-| Name | Type | Default | optional |
-| --- | --- | --- | --- |
-| deadlineISO | String<br>YYYY-MM-DDTHH:mm:ss.sssZ |  | className of this column |
-| deadline | String<br>YYYY-MM-DD HH:mm:ss | 32d,0h,0m,10s | key of this column |
-| deadlineDate | Date |  | className of this column |
-| countdownSize | String | 3rem | thead colSpan of this column |
-| labelSize | String | 1.2rem | title of this column |
-| flipAnimation | Boolean | true | width of the specific proportion calculation according to the width of the columns |
-| mainColor | String | '#EC685C' | Set custom props per each header cell. |
-| secondFlipColor | String | props.mainColor | Set custom props per each header cell. |
-| mainFlipBackgroundColor | String | '#222222' | Set custom props per each header cell. |
-| secondFlipBackgroundColor | String | '#393939' | Set custom props per each header cell. |
-| showLabels | Boolean | true | Set custom props per each header cell. |
-| labelColor | Function(record) | '#222222' | Set custom props per each header cell. |
-| stop | Boolean |  | display field of the data record |
-| showDays | Boolean | true | this column will be fixed when table scroll horizontally: true or 'left' or 'right' |
-| showHours | Boolean | true | specify how cell content is aligned |
-| showMinutes | Boolean | true | specify whether cell content be ellipsized |
-| showSeconds | Boolean | true | Set custom props per each cell. |
-| labels | Object | {days: 'Days',hours: 'Hours',minutes: 'Minutes',seconds: 'Seconds',} | Set custom props per each header cell. |
+| Name | Type | Default | 
+| --- | --- | --- |
+| deadlineISO | String<br>YYYY-MM-DDTHH:mm:ss.sssZ |  | 
+| deadline | String<br>YYYY-MM-DD HH:mm:ss | 32d,0h,0m,10s | 
+| deadlineDate | Date |  | 
+| countdownSize | String | 3rem | 
+| labelSize | String | 1.2rem | 
+| flipAnimation | Boolean | true |
+| mainColor | String | '#EC685C' |
+| secondFlipColor | String | props.mainColor | 
+| mainFlipBackgroundColor | String | '#222222' | 
+| secondFlipBackgroundColor | String | '#393939' |
+| labelColor | String | '#222222' |
+| showLabels | Boolean | true |
+| stop | Boolean |  |
+| showDays | Boolean | true |
+| showHours | Boolean | true |
+| showMinutes | Boolean | true |
+| showSeconds | Boolean | true |
+| labels | Object | {days: 'Days',hours: 'Hours',minutes: 'Minutes',seconds: 'Seconds',} |
 
@@ -97,6 +126,6 @@
 
-- [Vue](https://vuejs.org/) version **^3.0.0**
+- [Vue](https://vuejs.org/) version **3.x.x**
 
 ## License
 
-**MIT** (c) Emre Coşkunçay
+[MIT](https://choosealicense.com/licenses/mit/) Copyright (c) 2021, [Emre Coşkunçay](https://github.com/coskuncayemre)

Fixed alerts

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

130

increased by28.71%

Number of low supply chain risk alerts

5

decreased by-16.67%

Worsened metrics

Total package byte prevSize

2062397

decreased by-0.07%

Number of package files

8

decreased by-20%

Lines of code

47920

decreased by-0.16%

No dependency changes