{"id":33007943,"url":"https://github.com/coskuncay/vue3-flip-countdown","last_synced_at":"2026-02-20T22:32:17.343Z","repository":{"id":38348422,"uuid":"429039469","full_name":"coskuncay/vue3-flip-countdown","owner":"coskuncay","description":"Countdown timer with Flip Animation for Vue 3.x","archived":false,"fork":false,"pushed_at":"2023-11-25T10:29:09.000Z","size":154,"stargazers_count":112,"open_issues_count":7,"forks_count":17,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-10-12T09:55:20.633Z","etag":null,"topics":["countdown","countdown-timer","flip-countdown","javascript","timer","vue","vue3","vuejs","vuejs-components","vuejs3"],"latest_commit_sha":null,"homepage":"https://vue3-flip-countdown.netlify.app","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/coskuncay.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2021-11-17T12:36:29.000Z","updated_at":"2025-09-29T17:35:45.000Z","dependencies_parsed_at":"2024-01-02T23:29:47.039Z","dependency_job_id":"9832119e-42b1-4793-9045-228447478ed8","html_url":"https://github.com/coskuncay/vue3-flip-countdown","commit_stats":null,"previous_names":["coskuncayemre/vue3-flip-countdown"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/coskuncay/vue3-flip-countdown","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/coskuncay%2Fvue3-flip-countdown","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/coskuncay%2Fvue3-flip-countdown/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/coskuncay%2Fvue3-flip-countdown/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/coskuncay%2Fvue3-flip-countdown/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/coskuncay","download_url":"https://codeload.github.com/coskuncay/vue3-flip-countdown/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/coskuncay%2Fvue3-flip-countdown/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29667089,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-20T19:49:36.704Z","status":"ssl_error","status_checked_at":"2026-02-20T19:44:05.372Z","response_time":59,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["countdown","countdown-timer","flip-countdown","javascript","timer","vue","vue3","vuejs","vuejs-components","vuejs3"],"created_at":"2025-11-13T15:00:44.264Z","updated_at":"2026-02-20T22:32:17.329Z","avatar_url":"https://github.com/coskuncay.png","language":"Vue","funding_links":[],"categories":["Components \u0026 Libraries"],"sub_categories":["UI Components"],"readme":"# vue3-flip-countdown\n\n\u003e Customize Countdown timer with Flip Animation for [Vue](https://vuejs.org/ \"Vue Homepage\") 3.x\n\n\u003e [vue3-flip-countdown.netlify.app](https://vue3-flip-countdown.netlify.app/)\n\n\n\u003cp align=\"center\"\u003e\n  \n![Netlify Status](https://api.netlify.com/api/v1/badges/69e11230-2c8b-4725-9540-7c0a861294e4/deploy-status)\n  \u003cimg src=\"https://img.shields.io/npm/l/vue3-flip-countdown\" /\u003e\n  \u003ca href=\"https://github.com/vuejs/awesome-vue\"\u003e\u003cimg src=\"https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg\"/\u003e\u003c/a\u003e\n  \u003ca href=\"https://www.npmjs.com/package/vue3-flip-countdown\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/vue3-flip-countdown\"/\u003e \n   \u003cimg src=\"https://img.shields.io/npm/dt/vue3-flip-countdown\"/\u003e\u003c/a\u003e\n  \u003ca href=\"https://vuejs.org/\"\u003e\u003cimg src=\"https://img.shields.io/badge/vue-3.x-brightgreen.svg\"/\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n\n## [Demo](https://vue3-flip-countdown.netlify.app/)\n\n\n\u003ca href=\"https://vue3-flip-countdown.netlify.app/\" target=\"_blank\"\u003e\u003cimg src=\"https://user-images.githubusercontent.com/29631083/142426544-536cc337-106b-4f3f-ba09-85f1062e3c5c.gif\" width=\"800\"/\u003e\u003c/a\u003e\n\n\n## Table of contents\n  \n\n- [Demo](#demo)\n- [Installation](#installation)\n- [Global Usage](#global-usage)\n- [Single File Component Usage](#single-file-component-usage)\n- [Emits](#emits)\n- [Props](#props)\n- [References](#references)\n- [Requirements](#requirements)\n- [License](#license)\n\n## Installation\n\n```\nnpm i vue3-flip-countdown --save\n```\n\n## Global Usage\nmain.js\n```js\nimport { createApp } from 'vue'\nimport App from './App.vue'\nimport Countdown from 'vue3-flip-countdown'\ncreateApp(App).use(Countdown).mount('#app')\n```\n\nApp.vue\n```js\n\u003ctemplate\u003e\n  \u003cvue3-flip-countdown /\u003e\n\u003c/template\u003e\n\n\u003cscript\u003e\n\nexport default {\n  name: 'App',\n  components: {\n  }\n}\n\u003c/script\u003e\n```\n\n## Single File Component Usage\n```vue\n\u003ctemplate\u003e\n  \u003cCountdown /\u003e\n\u003c/template\u003e\n\n\u003cscript\u003e\nimport {Countdown} from 'vue3-flip-countdown'\nexport default {\n  name: 'App',\n  components: {\n    Countdown\n  }\n}\n\u003c/script\u003e\n```\n\n## Emits\n\n| Name | Description | \n| --- | --- |\n| timeElapsed | event that created when the time came | \n\n## Props\n\n| Name | Type | Default | \n| --- | --- | --- |\n| deadlineISO | String\u003cbr\u003eYYYY-MM-DDTHH:mm:ss.sssZ |  | \n| deadline | String\u003cbr\u003eYYYY-MM-DD HH:mm:ss | 32d,0h,0m,10s | \n| deadlineDate | Date |  | \n| countdownSize | String | 3rem | \n| labelSize | String | 1.2rem | \n| flipAnimation | Boolean | true |\n| mainColor | String | '#EC685C' |\n| secondFlipColor | String | props.mainColor | \n| mainFlipBackgroundColor | String | '#222222' | \n| secondFlipBackgroundColor | String | '#393939' |\n| labelColor | String | '#222222' |\n| showLabels | Boolean | true |\n| stop | Boolean |  |\n| showDays | Boolean | true |\n| showHours | Boolean | true |\n| showMinutes | Boolean | true |\n| showSeconds | Boolean | true |\n| labels | Object | {days: 'Days',hours: 'Hours',minutes: 'Minutes',seconds: 'Seconds',} |\n\n\n\n# References\n\n- [vue2-flip-countdown](https://github.com/philipjkim/vue2-flip-countdown)\n- [vuejs-countdown](https://github.com/getanwar/vuejs-countdown)\n- [Demo for 'Flip clock \u0026 countdown, Vue'](https://codepen.io/shshaw/pen/BzObXp)\n\n## Requirements\n\n- [Vue](https://vuejs.org/) version **3.x.x**\n\n## License\n\n[MIT](https://choosealicense.com/licenses/mit/) Copyright (c) 2021, [Emre Coşkunçay](https://github.com/coskuncayemre)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcoskuncay%2Fvue3-flip-countdown","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcoskuncay%2Fvue3-flip-countdown","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcoskuncay%2Fvue3-flip-countdown/lists"}