about summary refs log tree commit diff
path: root/components/DayCountdown.vue
diff options
context:
space:
mode:
authorPatryk Niedźwiedziński <pniedzwiedzinski19@gmail.com>2020-01-28 19:55:17 +0100
committerPatryk Niedźwiedziński <pniedzwiedzinski19@gmail.com>2020-01-28 19:55:17 +0100
commit474d2bd31fdb0d13e07793c31d82e4eb264731cf (patch)
tree86cbfd30da21cc7abecc611c6ecdc6140a542a28 /components/DayCountdown.vue
parentc6b9b1e2846e769dbeb7cbb567a4e9ec08f3dd9c (diff)
parenta441d3e5284bf1883a55810e7387b43ff4836de3 (diff)
downloadpuszcza-474d2bd31fdb0d13e07793c31d82e4eb264731cf.tar.gz
puszcza-474d2bd31fdb0d13e07793c31d82e4eb264731cf.zip
Merge remote-tracking branch 'origin/master' into feature/json-api
Diffstat (limited to 'components/DayCountdown.vue')
-rw-r--r--components/DayCountdown.vue47
1 files changed, 47 insertions, 0 deletions
diff --git a/components/DayCountdown.vue b/components/DayCountdown.vue
new file mode 100644
index 0000000..9415917
--- /dev/null
+++ b/components/DayCountdown.vue
@@ -0,0 +1,47 @@
+<template>
+  <client-only>
+    <div class="countdown">
+      {{ text }} <span>{{ days }} dni</span>
+    </div>
+  </client-only>
+</template>
+
+<script>
+export default {
+  name: 'DayCountdown',
+  props: {
+    text: {
+      type: String,
+      required: true,
+    },
+    endDate: {
+      type: Date,
+      required: true,
+    },
+    startDate: {
+      type: Date,
+      default: () => new Date(Date.now()),
+    },
+  },
+  computed: {
+    days() {
+      return Math.round(
+        (this.endDate.getTime() - this.startDate.getTime()) / 86400000
+      )
+    },
+  },
+}
+</script>
+
+<style>
+.countdown {
+  background: #ffffff;
+  box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.2);
+  padding: 20px;
+  margin: 50px 10px;
+}
+
+.countdown span {
+  font-weight: 600;
+}
+</style>