Skip to content

Commit 5f80bb9

Browse files
xdeqxdeq
authored
Merge pull request #10 from celenium-io/dev
Dev
2 parents a51752b + 8a441f2 commit 5f80bb9

File tree

16 files changed

+710
-519
lines changed

16 files changed

+710
-519
lines changed

‎app.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ onMounted(async () => {
3030
<template>
3131
<CommandMenu :show="appStore.showCmd" />
3232

33+
<NuxtLoadingIndicator height="2" color="#0ade71" />
3334
<NuxtLayout>
3435
<NuxtPage />
3536

‎assets/styles/base.scss

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,7 @@ $grayscale: (
6161
--feed-background: rgba(0, 0, 0, 8%);
6262
--notification-background: rgba(0, 0, 0, 95%);
6363
--block-progress-background: rgba(0, 0, 0, 20%);
64+
--block-progress-fill-background: #33a853;
6465
--logo-name: var(--txt-primary);
6566
--bar-fill: rgb(243, 147, 45);
6667
}
@@ -116,6 +117,7 @@ $grayscale: (
116117
--feed-background: rgba(0, 0, 0, 8%);
117118
--notification-background: rgba(0, 0, 0, 95%);
118119
--block-progress-background: rgba(0, 0, 0, 20%);
120+
--block-progress-fill-background: #33a853;
119121
--logo-name: var(--txt-primary);
120122
--bar-fill: rgb(243, 147, 45);
121123
}
@@ -128,6 +130,7 @@ $grayscale: (
128130
--card-background: rgb(255, 255, 255);
129131
--tooltip-background: rgba(255, 255, 255, 100%);
130132
--outline-background: #e5e5e5;
133+
--outline-background-hover: #d7d7d7;
131134
--outline-gradient: linear-gradient(var(--op-10), var(--op-20));
132135

133136
/* Text */
@@ -145,7 +148,7 @@ $grayscale: (
145148
--red: #eb5757;
146149
--orange: #ff5a17;
147150
--light-orange: #ff8351;
148-
--yellow: #ffd400;
151+
--yellow: #e5c10b;
149152
--green: #26c071;
150153
--neutral-green: #33a853;
151154
--purple: #5856de;
@@ -170,6 +173,7 @@ $grayscale: (
170173
--feed-background: rgba(0, 0, 0, 2%);
171174
--notification-background: rgba(255, 255, 255, 95%);
172175
--block-progress-background: rgba(0, 0, 0, 8%);
176+
--block-progress-fill-background: #33a853;
173177
--logo-name: var(--txt-primary);
174178
--bar-fill: rgb(243, 147, 45);
175179
}

‎components/Flex.vue

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,12 @@ defineExpose({ wrapper })
66
77
const props = defineProps({
88
tag: {
9-
type: String,
109
default: "div",
1110
},
11+
to: {
12+
type: String,
13+
required: false,
14+
},
1215
align: {
1316
type: String,
1417
validator(value) {
@@ -69,7 +72,7 @@ const classes = computed(() => {
6972
</script>
7073

7174
<template>
72-
<component :is="tag" ref="wrapper" :class="classes">
75+
<component :is="tag" v-bind="{ to: to ? to : null }" ref="wrapper" :class="classes">
7376
<slot />
7477
</component>
7578
</template>

‎components/TheHeader.vue

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -78,10 +78,9 @@ const handleNavigate = (url) => {
7878
<Flex align="center" gap="12">
7979
<Icon name="logo" size="18" color="white" :class="$style.logo" />
8080

81-
<svg width="96" height="16" viewBox="0 0 96 16" fill="none" xmlns="http://www.w3.org/2000/svg">
81+
<svg width="96" height="16" viewBox="0 0 96 16" xmlns="http://www.w3.org/2000/svg" :class="$style.logo_name">
8282
<path
8383
d="M14.22 10.46C14.0867 11.46 13.7333 12.32 13.16 13.04C12.5867 13.7467 11.82 14.2933 10.86 14.68C9.91333 15.0533 8.80667 15.24 7.54 15.24C6.44667 15.24 5.44 15.0933 4.52 14.8C3.61333 14.5067 2.82 14.08 2.14 13.52C1.47333 12.9467 0.953333 12.2467 0.58 11.42C0.22 10.58 0.04 9.62 0.04 8.54C0.04 7.44667 0.22 6.48667 0.58 5.66C0.953333 4.83333 1.47333 4.13333 2.14 3.56C2.82 2.97333 3.61333 2.53333 4.52 2.24C5.44 1.94667 6.44667 1.8 7.54 1.8C8.82 1.8 9.93333 1.99333 10.88 2.38C11.84 2.76667 12.6067 3.32 13.18 4.04C13.7533 4.76 14.1 5.62667 14.22 6.64H12.02C11.8333 6.04 11.54 5.53333 11.14 5.12C10.74 4.69333 10.2333 4.36667 9.62 4.14C9.02 3.91333 8.32667 3.8 7.54 3.8C6.55333 3.8 5.66667 3.98667 4.88 4.36C4.09333 4.72 3.47333 5.25333 3.02 5.96C2.58 6.65333 2.36 7.51333 2.36 8.54C2.36 9.55333 2.58 10.4133 3.02 11.12C3.47333 11.8133 4.09333 12.34 4.88 12.7C5.66667 13.06 6.55333 13.24 7.54 13.24C8.32667 13.24 9.02 13.1333 9.62 12.92C10.22 12.6933 10.72 12.3733 11.12 11.96C11.52 11.5333 11.8133 11.0333 12 10.46H14.22ZM24.8295 11.72H26.9695C26.8629 12.4 26.5962 13.0067 26.1695 13.54C25.7562 14.06 25.1895 14.4733 24.4695 14.78C23.7495 15.0733 22.8895 15.22 21.8895 15.22C20.7562 15.22 19.7429 15.0133 18.8495 14.6C17.9562 14.1733 17.2562 13.5733 16.7495 12.8C16.2429 12.0267 15.9895 11.1067 15.9895 10.04C15.9895 8.98667 16.2362 8.06667 16.7295 7.28C17.2229 6.49333 17.9029 5.88667 18.7695 5.46C19.6495 5.03333 20.6629 4.82 21.8095 4.82C22.9962 4.82 23.9829 5.03333 24.7695 5.46C25.5695 5.87333 26.1629 6.5 26.5495 7.34C26.9362 8.16667 27.0962 9.21333 27.0295 10.48H18.2495C18.3162 11.04 18.4962 11.5467 18.7895 12C19.0962 12.44 19.5095 12.7867 20.0295 13.04C20.5495 13.28 21.1562 13.4 21.8495 13.4C22.6229 13.4 23.2695 13.2467 23.7895 12.94C24.3229 12.6333 24.6695 12.2267 24.8295 11.72ZM21.7495 6.62C20.8429 6.62 20.0962 6.84667 19.5095 7.3C18.9229 7.74 18.5429 8.30667 18.3695 9H24.7895C24.7362 8.25333 24.4362 7.67333 23.8895 7.26C23.3429 6.83333 22.6295 6.62 21.7495 6.62ZM29.2095 1.04H31.4295V15H29.2095V1.04ZM42.4467 11.72H44.5867C44.4801 12.4 44.2134 13.0067 43.7867 13.54C43.3734 14.06 42.8067 14.4733 42.0867 14.78C41.3667 15.0733 40.5067 15.22 39.5067 15.22C38.3734 15.22 37.3601 15.0133 36.4667 14.6C35.5734 14.1733 34.8734 13.5733 34.3667 12.8C33.8601 12.0267 33.6067 11.1067 33.6067 10.04C33.6067 8.98667 33.8534 8.06667 34.3467 7.28C34.8401 6.49333 35.5201 5.88667 36.3867 5.46C37.2667 5.03333 38.2801 4.82 39.4267 4.82C40.6134 4.82 41.6001 5.03333 42.3867 5.46C43.1867 5.87333 43.7801 6.5 44.1667 7.34C44.5534 8.16667 44.7134 9.21333 44.6467 10.48H35.8667C35.9334 11.04 36.1134 11.5467 36.4067 12C36.7134 12.44 37.1267 12.7867 37.6467 13.04C38.1667 13.28 38.7734 13.4 39.4667 13.4C40.2401 13.4 40.8867 13.2467 41.4067 12.94C41.9401 12.6333 42.2867 12.2267 42.4467 11.72ZM39.3667 6.62C38.4601 6.62 37.7134 6.84667 37.1267 7.3C36.5401 7.74 36.1601 8.30667 35.9867 9H42.4067C42.3534 8.25333 42.0534 7.67333 41.5067 7.26C40.9601 6.83333 40.2467 6.62 39.3667 6.62ZM46.6267 5.04H48.8467V15H46.6267V5.04ZM53.0467 4.82C53.6201 4.82 54.1467 4.9 54.6267 5.06C55.1201 5.22 55.5401 5.46667 55.8867 5.8C56.2467 6.12 56.5201 6.52 56.7067 7C56.9067 7.48 57.0067 8.04667 57.0067 8.7V15H54.7867V9.14C54.7867 8.32667 54.5867 7.72667 54.1867 7.34C53.8001 6.94 53.1867 6.74 52.3467 6.74C51.7067 6.74 51.1201 6.88 50.5867 7.16C50.0667 7.42667 49.6401 7.78 49.3067 8.22C48.9734 8.64667 48.7801 9.12 48.7267 9.64L48.7067 8.56C48.7734 8.06667 48.9201 7.6 49.1467 7.16C49.3734 6.70667 49.6734 6.30667 50.0467 5.96C50.4201 5.6 50.8601 5.32 51.3667 5.12C51.8734 4.92 52.4334 4.82 53.0467 4.82ZM62.0588 0.819999V2.96H59.3988V0.819999H62.0588ZM59.5988 5.04H61.8388V15H59.5988V5.04ZM74.8778 15H72.6578V5.04H74.8778V15ZM72.7778 10.26L72.7978 10.9C72.7711 11.0733 72.7111 11.3333 72.6178 11.68C72.5378 12.0267 72.3978 12.4067 72.1978 12.82C72.0111 13.22 71.7578 13.6067 71.4378 13.98C71.1311 14.34 70.7445 14.64 70.2778 14.88C69.8111 15.1067 69.2445 15.22 68.5778 15.22C68.0978 15.22 67.6111 15.1533 67.1178 15.02C66.6378 14.9 66.1978 14.6933 65.7978 14.4C65.4111 14.1067 65.0978 13.7067 64.8578 13.2C64.6178 12.6933 64.4978 12.0533 64.4978 11.28V5.04H66.7178V10.86C66.7178 11.4867 66.8178 11.98 67.0178 12.34C67.2311 12.6867 67.5245 12.9333 67.8978 13.08C68.2711 13.2267 68.7045 13.3 69.1978 13.3C69.9045 13.3 70.5045 13.14 70.9978 12.82C71.4911 12.5 71.8845 12.1067 72.1778 11.64C72.4845 11.16 72.6845 10.7 72.7778 10.26ZM77.3298 5.04H79.5498V15H77.3298V5.04ZM83.7498 4.82C84.3232 4.82 84.8498 4.9 85.3298 5.06C85.8232 5.22 86.2432 5.46667 86.5898 5.8C86.9498 6.12 87.2232 6.52 87.4098 7C87.6098 7.48 87.7098 8.04667 87.7098 8.7V15H85.4898V9.14C85.4898 8.32667 85.2898 7.72667 84.8898 7.34C84.5032 6.94 83.8898 6.74 83.0498 6.74C82.4098 6.74 81.8232 6.88 81.2898 7.16C80.7698 7.42667 80.3432 7.78 80.0098 8.22C79.6765 8.64667 79.4832 9.12 79.4298 9.64L79.4098 8.56C79.4765 8.06667 79.6232 7.6 79.8498 7.16C80.0765 6.70667 80.3765 6.30667 80.7498 5.96C81.1232 5.6 81.5632 5.32 82.0698 5.12C82.5765 4.92 83.1365 4.82 83.7498 4.82ZM91.6898 4.82C92.2765 4.82 92.8098 4.9 93.2898 5.06C93.7698 5.22 94.1832 5.46667 94.5298 5.8C94.8898 6.12 95.1698 6.52 95.3698 7C95.5698 7.48 95.6698 8.04667 95.6698 8.7V15H93.4298V9.14C93.4298 8.32667 93.2298 7.72667 92.8298 7.34C92.4432 6.94 91.8298 6.74 90.9898 6.74C90.3498 6.74 89.7632 6.88 89.2298 7.16C88.7098 7.42667 88.2832 7.78 87.9498 8.22C87.6298 8.64667 87.4432 9.12 87.3898 9.64L87.3498 8.52C87.4165 8.04 87.5698 7.58 87.8098 7.14C88.0498 6.68667 88.3565 6.28667 88.7298 5.94C89.1032 5.59333 89.5365 5.32 90.0298 5.12C90.5365 4.92 91.0898 4.82 91.6898 4.82Z"
84-
fill="white"
8584
/>
8685
</svg>
8786
</Flex>

‎components/data/BlocksTimeline/BlocksTimelineTable.vue

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -189,7 +189,7 @@ watch(
189189
<Text size="12" weight="600" color="secondary">Receiving new blocks</Text>
190190
</Flex>
191191
<Flex v-else align="center" justify="center" gap="6" :class="$style.status">
192-
<Icon name="pause" size="12" color="yellow" />
192+
<Icon name="pause" size="12" color="secondary" />
193193
<Text size="12" weight="600" color="secondary">Receiving new blocks on pause</Text>
194194
</Flex>
195195
@@ -211,13 +211,15 @@ watch(
211211
:class="preview.block.time === block.time && $style.active"
212212
>
213213
<td style="width: 1px">
214-
<Outline>
215-
<Flex align="center" gap="6">
216-
<Icon name="block" size="14" color="primary" />
214+
<NuxtLink :to="`/block/${block.height}`">
215+
<Outline>
216+
<Flex align="center" gap="6">
217+
<Icon name="block" size="14" color="primary" />
217218
218-
<Text size="13" weight="600" color="primary" tabular>{{ comma(block.height) }}</Text>
219-
</Flex>
220-
</Outline>
219+
<Text size="13" weight="600" color="primary" tabular>{{ comma(block.height) }}</Text>
220+
</Flex>
221+
</Outline>
222+
</NuxtLink>
221223
</td>
222224
<td>
223225
<Flex direction="column" gap="4">

‎components/data/LatestPFBTable.vue

Lines changed: 69 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -43,68 +43,80 @@ isLoading.value = false
4343
</thead>
4444

4545
<tbody>
46-
<tr v-for="pfb in pfbs" @click="router.push(`/tx/${pfb.hash}`)">
46+
<tr v-for="pfb in pfbs">
4747
<td style="width: 1px">
48-
<Tooltip position="start">
49-
<Flex align="center" gap="8">
50-
<Icon
51-
:name="pfb.status === 'success' ? 'check-circle' : 'close-circle'"
52-
size="14"
53-
:color="pfb.status === 'success' ? 'green' : 'red'"
54-
/>
55-
56-
<Text size="13" weight="600" color="primary" mono>
57-
{{ pfb.hash.slice(0, 4).toUpperCase() }}
58-
</Text>
59-
60-
<Flex align="center" gap="3">
61-
<div v-for="dot in 3" class="dot" />
62-
</Flex>
48+
<NuxtLink :to="`/tx/${pfb.hash}`">
49+
<Tooltip position="start">
50+
<Flex align="center" gap="8">
51+
<Icon
52+
:name="pfb.status === 'success' ? 'check-circle' : 'close-circle'"
53+
size="14"
54+
:color="pfb.status === 'success' ? 'green' : 'red'"
55+
/>
56+
57+
<Text size="13" weight="600" color="primary" mono>
58+
{{ pfb.hash.slice(0, 4).toUpperCase() }}
59+
</Text>
60+
61+
<Flex align="center" gap="3">
62+
<div v-for="dot in 3" class="dot" />
63+
</Flex>
6364

64-
<Text size="13" weight="600" color="primary" mono>
65-
{{ pfb.hash.slice(pfb.hash.length - 4, pfb.hash.length).toUpperCase() }}
66-
</Text>
65+
<Text size="13" weight="600" color="primary" mono>
66+
{{ pfb.hash.slice(pfb.hash.length - 4, pfb.hash.length).toUpperCase() }}
67+
</Text>
6768

68-
<CopyButton :text="pfb.hash.toUpperCase()" />
69-
</Flex>
69+
<CopyButton :text="pfb.hash.toUpperCase()" />
70+
</Flex>
7071

71-
<template #content>
72-
<Flex direction="column" gap="6">
73-
<Flex align="center" gap="4">
74-
<Icon
75-
:name="pfb.status === 'success' ? 'check-circle' : 'close-circle'"
76-
size="13"
77-
:color="pfb.status === 'success' ? 'green' : 'red'"
78-
/>
79-
<Text size="13" weight="600" color="primary">
80-
{{ pfb.status === "success" ? "Successful" : "Failed" }} Transaction
81-
</Text>
72+
<template #content>
73+
<Flex direction="column" gap="6">
74+
<Flex align="center" gap="4">
75+
<Icon
76+
:name="pfb.status === 'success' ? 'check-circle' : 'close-circle'"
77+
size="13"
78+
:color="pfb.status === 'success' ? 'green' : 'red'"
79+
/>
80+
<Text size="13" weight="600" color="primary">
81+
{{ pfb.status === "success" ? "Successful" : "Failed" }} Transaction
82+
</Text>
83+
</Flex>
84+
85+
{{ space(pfb.hash.toUpperCase()) }}
8286
</Flex>
83-
84-
{{ space(pfb.hash.toUpperCase()) }}
85-
</Flex>
86-
</template>
87-
</Tooltip>
87+
</template>
88+
</Tooltip>
89+
</NuxtLink>
8890
</td>
8991
<td>
90-
<Outline @click.stop="router.push(`/block/${pfb.height}`)">
91-
<Flex align="center" gap="6">
92-
<Icon name="block" size="14" color="secondary" />
92+
<NuxtLink :to="`/tx/${pfb.hash}`">
93+
<Flex align="center">
94+
<Outline @click.prevent="router.push(`/block/${pfb.height}`)">
95+
<Flex align="center" gap="6">
96+
<Icon name="block" size="14" color="secondary" />
9397

94-
<Text size="13" weight="600" color="primary" tabular>{{ comma(pfb.height) }}</Text>
98+
<Text size="13" weight="600" color="primary" tabular>{{ comma(pfb.height) }}</Text>
99+
</Flex>
100+
</Outline>
95101
</Flex>
96-
</Outline>
102+
</NuxtLink>
97103
</td>
98104
<td>
99-
<Text size="12" weight="600" color="primary">{{
100-
DateTime.fromISO(pfb.time).toRelative({ locale: "en", style: "short" })
101-
}}</Text>
105+
<NuxtLink :to="`/tx/${pfb.hash}`">
106+
<Flex align="center">
107+
<Text size="12" weight="600" color="primary">
108+
{{ DateTime.fromISO(pfb.time).toRelative({ locale: "en", style: "short" }) }}
109+
</Text>
110+
</Flex>
111+
</NuxtLink>
102112
</td>
103113
<td>
104-
<Flex align="center" gap="4">
105-
<Text size="13" weight="600" color="primary"> {{ tia(pfb.fee) }} </Text>
106-
<Text size="13" weight="600" color="tertiary"> TIA </Text>
107-
</Flex>
114+
<NuxtLink :to="`/tx/${pfb.hash}`">
115+
<Flex align="center" gap="4">
116+
<Text size="13" weight="600" color="primary"> {{ tia(pfb.fee) }} </Text>
117+
<Text size="13" weight="600" color="tertiary"> TIA </Text>
118+
</Flex>
119+
</NuxtLink>
108120
</td>
109121
</tr>
110122
</tbody>
@@ -184,15 +196,20 @@ isLoading.value = false
184196
185197
& tr td {
186198
padding: 0;
187-
padding-right: 24px;
188-
padding-top: 6px;
189-
padding-bottom: 6px;
190199
191200
white-space: nowrap;
192201
193202
&:first-child {
194203
padding-left: 16px;
195204
}
205+
206+
& > a {
207+
display: flex;
208+
209+
min-height: 40px;
210+
211+
padding-right: 24px;
212+
}
196213
}
197214
}
198215
}

0 commit comments

Comments
 (0)