diff options
| author | 2024-09-03 08:31:50 +0800 | |
|---|---|---|
| committer | 2024-09-03 08:31:50 +0800 | |
| commit | 66c5bb075b791b784511f00278e788df4e29fd92 (patch) | |
| tree | 0591290dde6c02e8a3a1890a74d40e07ad77852f /site/src/components/Left.vue | |
| parent | 76b990510093d7cc22ba571b3625f4725ddfc7cb (diff) | |
| parent | 731d318b4d5f279ea58f0688353a011a41532f42 (diff) | |
| download | HydroRoll-66c5bb075b791b784511f00278e788df4e29fd92.tar.gz HydroRoll-66c5bb075b791b784511f00278e788df4e29fd92.zip | |
Merge pull request #98 from NtskwK/main
feat: add video background to index page
Diffstat (limited to 'site/src/components/Left.vue')
| -rw-r--r-- | site/src/components/Left.vue | 84 |
1 files changed, 0 insertions, 84 deletions
diff --git a/site/src/components/Left.vue b/site/src/components/Left.vue deleted file mode 100644 index 672ba36..0000000 --- a/site/src/components/Left.vue +++ /dev/null @@ -1,84 +0,0 @@ -<script lang="ts"> -export default { - data(){ - return{ - day:0, - hour:0, - min:0, - sec:0, - timer:0 - } - }, - props:{ - msg:{ - type:String, - require:true - }, - date:{ - type:Date, - default:new Date('2024-07-14T12:00:00Z') - } - }, - methods:{ - getTime(){ - this.timer=window.setTimeout(()=>{ - const date1 = new Date(); - const date2 = new Date(this.date); - const timeDiff = Math.abs(date2.getTime() - date1.getTime()); - this.day = Math.floor(timeDiff / (1000 * 60 * 60 * 24)); - this.hour = Math.floor(timeDiff / (1000 * 60 * 60)%24); - this.min = Math.floor((timeDiff / (1000 * 60)) % 60); - this.sec = Math.floor((timeDiff / 1000) % 60); - this.getTime() - },1000) - } - }, - beforeMount() { - this.getTime() - } - -} -</script> - -<template> - <div class="greetings"> - <h1 class="green">{{ msg }}</h1> - <h3> - 距离水系公测还有 - </h3> - <h2> - {{ day }} 天 {{ hour }} 时 {{ min }} 分 {{ sec }} 秒 - </h2> - </div> -</template> - -<style scoped> -h1 { - font-weight: 500; - font-size: 2.6rem; - position: relative; - top: -10px; -} - -h3 { - font-size: 1.2rem; -} - -.greetings h1, -.greetings h2 { - text-align: center; -} -.greetings h3 { - text-align: center; -} - -@media (min-width: 1024px) { - .greetings h1, - .greetings h2 { - text-align: left; - } - .greetings h3 { - text-align: left; - } -} -</style> |
