zramsay/cosmos-explorer
1
0
Fork 0
forked from cerc-io/cosmos-explorer
Code Pull Requests Actions Activity

feat: uptime tooltip refactor

Browse Source
This commit is contained in:
Alisa | Side.one 2023-05-12 22:03:06 +08:00
parent 2d4720bc9b
commit ad4ad7bdee
2 changed files with 12 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/ChainSummary.vue
View File

@ -1,5 +1,5 @@
<script lang="ts" setup> <script lang="ts" setup>
import { getLogo, useDashboard } from '@/stores/useDashboard'; import { useDashboard } from '@/stores/useDashboard';
import { computed } from 'vue'; import { computed } from 'vue';
import { Icon } from '@iconify/vue'; import { Icon } from '@iconify/vue';

26
src/components/UptimeBar.vue
View File

@ -23,20 +23,16 @@ const bars = computed(() => {
}); });
</script> </script>
<template> <template>
<div class="flex items-center justify-evenly"> <div class="d-flex items-center justify-evenly">
<span <div class="cursor-default" v-for="(item, index) in bars" :key="index">
v-for="(b, i) in bars" <div class="tooltip" :data-tip="item.height">
:key="i" <span
:class="b.color" :class="item.color"
class="rounded" class="rounded"
style="width: 1.5%" style="width: 1.5%"
>&nbsp; >&nbsp;
<v-tooltip </span>
v-if="Number(b.height) > 0" </div>
activator="parent" </div>
location="top"
>{{ b.height }}</v-tooltip
>
</span>
</div> </div>
</template> </template>