From 100e44dd7299503767dc88eaa8d1cc6214ad6411 Mon Sep 17 00:00:00 2001
From: Carlos Rosado <carlos.rosado@ext.iovlabs.org>
Date: Wed, 28 Feb 2024 18:43:13 -0600
Subject: [PATCH 1/2] fix: Download button was positioned incorrectly, it was
 fixed correctly

---
 src/styles/_page.scss | 18 ++++++++++--------
 1 file changed, 10 insertions(+), 8 deletions(-)

diff --git a/src/styles/_page.scss b/src/styles/_page.scss
index c0af999c..d31c968f 100644
--- a/src/styles/_page.scss
+++ b/src/styles/_page.scss
@@ -4,7 +4,7 @@
     margin-bottom: 4rem;
     overflow-x: auto;
     .content-section {
-      min-width: 810px;
+      min-width: 865px;
     }
   }
 
@@ -124,10 +124,10 @@
       color: $orange_900;
     }
   }
-  // .data-table {
-  //   padding-top: 65px;
-  //   position: relative;
-  // }
+  .data-table {
+    padding-top: 65px;
+    position: relative;
+  }
   .content-section {
     position: relative;
     background-color: $newbw_800;
@@ -518,10 +518,11 @@
   color: $white_100;
   padding: 0 24px;
   h2 {
-    margin-bottom: 30px;
+    margin-bottom: 32px;
   }
   h3 {
     margin-top: 60px;
+    font-size: 25px;
   }
 
   .tx-pool-chart {
@@ -540,13 +541,14 @@
     margin: 30px 0;
   }
   .data-table {
-    margin-top: 60px;
+    margin-top: 20px;
     position: relative;
     
     .table-ctrls {
-      top: 15px;
+      top: 5px;
       position: relative;
       display: flex;
+      right: 0px;
     }
     table {
       margin-top: 20px;

From a377a63400391e5e8efd51a9daf52a5bbbeb1383 Mon Sep 17 00:00:00 2001
From: Carlos Rosado <carlos.rosado@ext.iovlabs.org>
Date: Wed, 28 Feb 2024 22:12:19 -0600
Subject: [PATCH 2/2] fix: show badge in PendingBlock and adding fixed height
 to transaction graph

---
 src/components/Charts/TxDensityChart.vue   |  2 +-
 src/components/home/Block/PendingBlock.vue |  1 +
 src/styles/_home.scss                      |  6 +++---
 src/styles/_navigation.scss                | 10 +++++-----
 4 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/src/components/Charts/TxDensityChart.vue b/src/components/Charts/TxDensityChart.vue
index 9f40e712..74790387 100644
--- a/src/components/Charts/TxDensityChart.vue
+++ b/src/components/Charts/TxDensityChart.vue
@@ -112,7 +112,7 @@ export default {
     onResize () {
       const chartContainer = this.$el.querySelector('.chart-container')
       const w = chartContainer.offsetWidth
-      const h = Math.max(chartContainer.offsetHeight, 130)
+      const h = 120
       this.size = { w, h }
     },
     barClick (event) {
diff --git a/src/components/home/Block/PendingBlock.vue b/src/components/home/Block/PendingBlock.vue
index c83c62b0..45bacce5 100644
--- a/src/components/home/Block/PendingBlock.vue
+++ b/src/components/home/Block/PendingBlock.vue
@@ -3,6 +3,7 @@
     <div class="pending-blocks">
       <button class="btn-upload-blocks" @click="updateBlocks">
         <img src="@/assets/svg/blocks-icon.svg" alt="">
+        <span class="w-badge" v-if="pending"></span>
       </button>
       <div class="text-blocks">{{ pending }} new blocks</div>
       <div class="time-blocks">in last {{ now - lastBlocksTime | abbr-time }}</div>
diff --git a/src/styles/_home.scss b/src/styles/_home.scss
index 9a31d46a..8d4b4427 100644
--- a/src/styles/_home.scss
+++ b/src/styles/_home.scss
@@ -126,19 +126,19 @@
     justify-content: center;
     padding: 10px 0;
     align-items: center;
-    // margin-bottom: 10px;
     border-left: 1px solid #3A3A3A;
     .btn-upload-blocks {
       position: relative;
     }
     .w-badge {
-      width: 10px;
-      height: 10px;
+      width: 12px;
+      height: 12px;
       background-color: $orange_900;
       border-radius: 50px;
       position: absolute;
       top: 0;
       right: 5px;
+      border: 2px solid $newbw_800;
     }
     .text-blocks {
       margin-top: 8px;
diff --git a/src/styles/_navigation.scss b/src/styles/_navigation.scss
index 5e2cd86e..6acff9db 100644
--- a/src/styles/_navigation.scss
+++ b/src/styles/_navigation.scss
@@ -245,26 +245,26 @@
         display: block;
       }
     }
-    &.link-blocks {
+    &.link-blocks.router-link-exact-active {
       background-color: $green_900;
       color: #000;
     }
-    &.link-txs {
+    &.link-txs.router-link-exact-active {
       background-color: $orange_900;
       color: #000;
     }
-    &.link-address {
+    &.link-address.router-link-exact-active {
       background-color: $pink_900;
       color: #fff;
       .block-icon {
         display: none;
       }
     }
-    &.link-tokens {
+    &.link-tokens.router-link-exact-active {
       background-color: $cyan_300;
       color: #000;
     }
-    &.link-apps {
+    &.link-apps.router-link-exact-active {
       background-color: white;
       color: #000;
       svg {