Skip to content

Commit 3d3c69e

Browse files
xdeqxdeq
committed
ref filters
1 parent 69fa2c7 commit 3d3c69e

8 files changed

Lines changed: 284 additions & 217 deletions

File tree

‎components/DatePicker.vue‎

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -281,13 +281,11 @@ watch(
281281
<template>
282282
<Popover :open="isOpen" @on-close="handleClose" :width="popoverStyles.width" :side="popoverStyles.side">
283283
<Button v-if="showTitle" @click="handleOpen" type="secondary" size="mini">
284-
<Icon name="plus-circle" size="12" color="tertiary" />
284+
<Icon name="plus-circle" size="12" :color="selectedRange ? 'brand' : 'tertiary'" />
285285
286-
<Text color="secondary">Date Range</Text>
286+
<Text color="secondary">Date Range<template v-if="selectedRange">:</template></Text>
287287
288288
<template v-if="selectedRange">
289-
<div :class="$style.vertical_divider" />
290-
291289
<Text size="12" weight="600" color="primary">
292290
{{ selectedRange }}
293291
</Text>
@@ -445,12 +443,6 @@ watch(
445443
height: 100%;
446444
}
447445
448-
.vertical_divider {
449-
min-width: 2px;
450-
height: 50%;
451-
background: var(--op-10);
452-
}
453-
454446
.period {
455447
cursor: pointer;
456448
}

‎components/modules/address/AddressOverview.vue‎

Lines changed: 20 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -854,12 +854,16 @@ const handleOpenQRModal = () => {
854854
size="mini"
855855
:disabled="!transactions.length && !hasActiveFilters"
856856
>
857-
<Icon name="plus-circle" size="12" color="tertiary" />
858-
<Text color="secondary">Status</Text>
857+
<Icon
858+
name="plus-circle"
859+
size="12"
860+
:color="Object.keys(filters.status).find((f) => filters.status[f]) ? 'brand' : 'tertiary'"
861+
/>
862+
<Text color="secondary"
863+
>Status<template v-if="Object.keys(filters.status).find((f) => filters.status[f])">:</template></Text
864+
>
859865
860866
<template v-if="Object.keys(filters.status).find((f) => filters.status[f])">
861-
<div :class="$style.vertical_divider" />
862-
863867
<Text size="12" weight="600" color="primary" style="text-transform: capitalize">
864868
{{
865869
Object.keys(filters.status)
@@ -874,7 +878,7 @@ const handleOpenQRModal = () => {
874878
875879
<template #content>
876880
<Flex direction="column" gap="12">
877-
<Text size="12" weight="500" color="secondary">Filter by Status</Text>
881+
<Text size="12" weight="600" color="secondary">Filter by Status</Text>
878882
879883
<Flex direction="column" gap="8">
880884
<Checkbox v-model="filters.status.success">
@@ -897,12 +901,18 @@ const handleOpenQRModal = () => {
897901
size="mini"
898902
:disabled="!transactions.length && !hasActiveFilters"
899903
>
900-
<Icon name="plus-circle" size="12" color="tertiary" />
901-
<Text color="secondary">Message Type</Text>
904+
<Icon
905+
name="plus-circle"
906+
size="12"
907+
:color="Object.keys(filters.message_type).find((f) => filters.message_type[f]) ? 'brand' : 'tertiary'"
908+
/>
909+
<Text color="secondary"
910+
>Message Type<template v-if="Object.keys(filters.message_type).find((f) => filters.message_type[f])"
911+
>:</template
912+
></Text
913+
>
902914
903915
<template v-if="Object.keys(filters.message_type).find((f) => filters.message_type[f])">
904-
<div :class="$style.vertical_divider" />
905-
906916
<Text size="12" weight="600" color="primary">
907917
{{
908918
Object.keys(filters.message_type).filter((f) => filters.message_type[f]).length < 3
@@ -929,7 +939,7 @@ const handleOpenQRModal = () => {
929939
930940
<template #content>
931941
<Flex direction="column" gap="12">
932-
<Text size="12" weight="500" color="secondary">Filter by Message Type</Text>
942+
<Text size="12" weight="600" color="secondary">Filter by Message Type</Text>
933943
934944
<Input v-model="searchTerm" size="small" placeholder="Search" autofocus />
935945

‎components/modules/block/BlobsTable.vue‎

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -187,7 +187,7 @@ const handlePrev = () => {
187187
<Flex direction="column" gap="4">
188188
<Flex align="center" gap="8">
189189
<Text size="12" weight="600" color="primary" mono class="table_column_alias">
190-
{{ $getDisplayName('namespaces', blob.namespace.namespace_id) }}
190+
{{ $getDisplayName("namespaces", blob.namespace.namespace_id) }}
191191
</Text>
192192
193193
<CopyButton :text="getNamespaceID(blob.namespace.namespace_id)" />
@@ -234,12 +234,7 @@ const handlePrev = () => {
234234
</Flex>
235235
236236
<Text size="13" weight="600" color="primary">
237-
{{
238-
blob.commitment.slice(
239-
blob.commitment.length - 4,
240-
blob.commitment.length,
241-
)
242-
}}
237+
{{ blob.commitment.slice(blob.commitment.length - 4, blob.commitment.length) }}
243238
</Text>
244239
245240
<CopyButton :text="blob.commitment" />

‎components/modules/block/BlockOverview.vue‎

Lines changed: 22 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -466,12 +466,16 @@ const handleViewRawTransactions = () => {
466466
<Flex wrap="wrap" align="center" justify="start" gap="8" :class="$style.filters">
467467
<Popover :open="isStatusPopoverOpen" @on-close="onStatusPopoverClose" width="200">
468468
<Button @click="handleOpenStatusPopover" type="secondary" size="mini" :disabled="!transactions.length">
469-
<Icon name="plus-circle" size="12" color="tertiary" />
470-
<Text color="secondary">Status</Text>
469+
<Icon
470+
name="plus-circle"
471+
size="12"
472+
:color="Object.keys(filters.status).find((f) => filters.status[f]) ? 'brand' : 'tertiary'"
473+
/>
474+
<Text color="secondary"
475+
>Status<template v-if="Object.keys(filters.status).find((f) => filters.status[f])">:</template></Text
476+
>
471477

472478
<template v-if="Object.keys(filters.status).find((f) => filters.status[f])">
473-
<div :class="$style.vertical_divider" />
474-
475479
<Text size="12" weight="600" color="primary" style="text-transform: capitalize">
476480
{{
477481
Object.keys(filters.status)
@@ -486,7 +490,7 @@ const handleViewRawTransactions = () => {
486490

487491
<template #content>
488492
<Flex direction="column" gap="12">
489-
<Text size="12" weight="500" color="secondary">Filter by Status</Text>
493+
<Text size="12" weight="600" color="secondary">Filter by Status</Text>
490494

491495
<Flex direction="column" gap="8">
492496
<Checkbox v-model="filters.status.success">
@@ -504,12 +508,18 @@ const handleViewRawTransactions = () => {
504508

505509
<Popover :open="isMessageTypePopoverOpen" @on-close="onMessageTypePopoverClose" width="250">
506510
<Button @click="handleOpenMessageTypePopover" type="secondary" size="mini" :disabled="!transactions.length">
507-
<Icon name="plus-circle" size="12" color="tertiary" />
508-
<Text color="secondary">Message Type</Text>
511+
<Icon
512+
name="plus-circle"
513+
size="12"
514+
:color="Object.keys(filters.message_type).find((f) => filters.message_type[f]) ? 'brand' : 'tertiary'"
515+
/>
516+
<Text color="secondary"
517+
>Message Type<template v-if="Object.keys(filters.message_type).find((f) => filters.message_type[f])"
518+
>:</template
519+
></Text
520+
>
509521

510522
<template v-if="Object.keys(filters.message_type).find((f) => filters.message_type[f])">
511-
<div :class="$style.vertical_divider" />
512-
513523
<Text size="12" weight="600" color="primary">
514524
{{
515525
Object.keys(filters.message_type).filter((f) => filters.message_type[f]).length < 3
@@ -536,7 +546,7 @@ const handleViewRawTransactions = () => {
536546

537547
<template #content>
538548
<Flex direction="column" gap="12">
539-
<Text size="12" weight="500" color="secondary">Filter by Message Type</Text>
549+
<Text size="12" weight="600" color="secondary">Filter by Message Type</Text>
540550

541551
<Input v-model="searchTerm" size="small" placeholder="Search" autofocus />
542552

@@ -992,9 +1002,9 @@ const handleViewRawTransactions = () => {
9921002
}
9931003
9941004
.filters {
995-
border-bottom: 1px dashed var(--op-8);
1005+
border-bottom: 1px solid var(--op-5);
9961006
997-
padding: 4px 8px 6px 8px;
1007+
padding: 12px 8px 12px 8px;
9981008
}
9991009
10001010
.empty {

0 commit comments

Comments
 (0)