デザインの調整など
This commit is contained in:
parent
78a963fe33
commit
d8fb729aee
6 changed files with 33 additions and 7 deletions
|
|
@ -1,12 +1,15 @@
|
|||
<template>
|
||||
<div class="_monospace">
|
||||
<span>
|
||||
<div class="acemodlh _monospace">
|
||||
<div>
|
||||
<span v-text="y"></span>/<span v-text="m"></span>/<span v-text="d"></span>
|
||||
</div>
|
||||
<div>
|
||||
<span v-text="hh"></span>
|
||||
<span :style="{ visibility: showColon ? 'visible' : 'hidden' }">:</span>
|
||||
<span v-text="mm"></span>
|
||||
<span :style="{ visibility: showColon ? 'visible' : 'hidden' }">:</span>
|
||||
<span v-text="ss"></span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -18,6 +21,9 @@ export default defineComponent({
|
|||
data() {
|
||||
return {
|
||||
clock: null,
|
||||
y: null,
|
||||
m: null,
|
||||
d: null,
|
||||
hh: null,
|
||||
mm: null,
|
||||
ss: null,
|
||||
|
|
@ -34,6 +40,9 @@ export default defineComponent({
|
|||
methods: {
|
||||
tick() {
|
||||
const now = new Date();
|
||||
this.y = now.getFullYear().toString();
|
||||
this.m = (now.getMonth() + 1).toString().padStart(2, '0');
|
||||
this.d = now.getDate().toString().padStart(2, '0');
|
||||
this.hh = now.getHours().toString().padStart(2, '0');
|
||||
this.mm = now.getMinutes().toString().padStart(2, '0');
|
||||
this.ss = now.getSeconds().toString().padStart(2, '0');
|
||||
|
|
@ -42,3 +51,12 @@ export default defineComponent({
|
|||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.acemodlh {
|
||||
opacity: 0.7;
|
||||
font-size: 0.85em;
|
||||
line-height: 1em;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue